Явное управление ресурсами в TypeScript

Явное управление ресурсами в TypeScript[** — using**

Недавно,](https://t.me/cherkashindev/160) когда я рассказывал, как мы пишем тесты, я уже упоминал, что в TypeScript’е появилось новое ключевое слово using. Оно позволяет нам сделать код чище и более линейным, избавившись от try/finally.

Но мы можем использовать using не только, когда открываем файл или подключение к базе данных, иначе его использование ограничилось бы исключительно сервером.

Мне нравится рассматривать using, как Undo/Redo только наоборот, сперва мы выполняем какое-то действие, а в конце отменяем его:

создали объект, удалили
показали спиннер и скрыли, когда получили данные

Причем отмена удобно происходит в самом конце функции, даже если мы используем async/await.

Вот простой пример, как можно использовать using, чтобы показывать/скрывать спиннер в React коде.

 
 
// обычный код на React
  useEffect(() => {
    (async () => {
      try {
        setIsLoading(true);
        await Promise.resolve().then(() => console.log("promise.resolve"));
      } finally {
        setIsLoading(false);
      }
    })()
  }, [])

 
 
// такой же код, с использованием using
  useEffect(() => {
    (async () => {
      using manager = new LoadingManager(setIsLoading);
      await Promise.resolve().then(() => console.log("promise.resolve"));
    })();
   }, []);
 
/**
 * Класс, который управляет состоянием спиннера
 */
class LoadingManager {
  constructor(private setIsLoading: (value: boolean) => any) {
    this.setIsLoading(true);
    console.log("constructor");
  }
 
  [Symbol.dispose]() {
    this.setIsLoading(false);
    console.log("disposer")
  }
}
 
// В консоли будет выведено в следующем порядке
// constructor
// promise.resolve
// disposer

Код можно открыть в песочнице.

К сожалению, нельзя опустить переменную manager, но это лучше, чем лепить везде try / finally.

Ещё по теме: