Использование async/await в конструкторе класса в Electron

Быстрый ответ

Для реализации асинхронной логики при инстанцировании класса, лучше использовать асинхронный фабричный метод, вместо классического подхода new MyClass(). Для этого нужно создать статический метод, который выполнит все необходимые асинхронные операции и вернёт уже готовый экземпляр класса.

class MyClass {
  constructor(data) {
    this.data = data;
  }

  // Асинхронный фабричный метод
  static async build() {
    const data = await loadData();
    return new MyClass(data);
  }
}

// Экземпляр создаётся с использованием асинхронной загрузки данных:
MyClass.build().then(instance => console.log(instance.data));

Не забудьте про метод static async build() при асинхронном создании экземпляров класса.

Применение асинхронных операций в методе init()

Если вам нужно выполнить асинхронные действия непосредственно после создания объекта, метод init() может быть удачным решением.

class MyClass {
  constructor() {
    // Синхронный код размещается здесь.
  }

  async init() {
    this.data = await loadData();
  }
}

// Пример использования:
const myInstance = new MyClass();
myInstance.init().then(() => {
  // Объект полностью готов к использованию.
});

Соблюдение типизации в TypeScript

При использовании асинхронных конструкторов в TypeScript, обязательно явно указывайте типы для корректной работы с типами данных.

class MyClass {
  data: Data;

  private constructor(data: Data) {
    this.data = data;
  }

  static async build(): Promise<MyClass> {
    const data = await loadData();
    return new MyClass(data);
  }
}

Подробнее об этом расскажет наш спикер на видео

Паттерн "Строитель" для последовательной сборки

В случае последовательного создания объектов великолепно справляется паттерн "Строитель", особенно если в вашем коде используются асинхронные операции.

class MyClassBuilder {
  constructor() {
    this.instance = new MyClass();
  }

  async withData() {
    this.instance.data = await loadData();
    return this;
  }

  build() {
    return this.instance;
  }
}

Визуализация

Можно представить конструктор класса как фундамент для дома:

Async/Await в конструкторе
| Фундамент (😴) | Строительство дома (🏗️) |

Различим два подхода к строительству:

Без async/await: Попытка строить дом 🏗️ сразу после заливки фундамента 😴 похожа на возводить здание на ещё не застывшем бетоне.

| Заливка фундамента (😴) | Строительство дома (🏗️) |
| -------------- | ------------------- |
| Начало без задержек        | 🚧 Опасность: свалившийся кирпич!  |

С async/await: Дать фундаменту 😴 время для того, чтобы он полностью застыл, затем приступить к строительству 🏗️, позволяет построить устойчивую и надёжную конструкцию.

| Заливка фундамента (😴) | Ожидание (⏳) | Строительство дома (🏗️) |
| -------------- | ---------- | ------------------- |
| Задано обещание    | Время застывания как у кота на клавиатуре | Безопасное строительство 🏠 |

Именно соблюдение правильного ПОРЯДКА и ВРЕМЕНИ гарантирует устойчивость вашего кода!

Синхронный конструктор       | Асинхронный конструктор                 
-------------- | ---------------------------
🚧 Насколько это надёжно?   | 🛠️ Готов к любым сложностям

Обработка неопределённых значений

Обеспечьте контроль таким образом, чтобы асинхронные операции в конструкторах не возвращали неопределённые или неполные объекты.

// Обработка ошибок внутри асинхронного статического метода
class MyClass {
  static async build() {
    try {
      const data = await loadData();
      return new MyClass(data);
    } catch (error) {
      console.error('Ошибка при загрузке данных:', error);
      throw error;
    }
  }
}

Особое внимание к обработке ошибок

Сконцентрируйтесь на предупреждении ошибок: включите обработку исключений в свои асинхронные операции.

Безопасное наследование и использование фабричного метода

Наследование: Рекомендуется избегать использования асинхронных конструкторов при наследовании классов, так как это может осложнить работу метода super().

class ParentClass {
  data;

  constructor(data) {
    this.data = data;
  }
}

class ChildClass extends ParentClass {
  async init() {
    this.extraData = await loadExtraData();
  }
}

Фабричные функции: Метод Object.create() в сочетании с фабричной функцией, прошедшей обстоятельную проверку, может быть использован для создания и асинхронной инициализации объекта.

function createMyClassAsync() {
  const instance = Object.create(MyClass.prototype);
  
  return loadData().then(data => {
    instance.data = data;
    return instance;
  });
}

Декорирование кода

Декораторы: Если прямое изменение класса невозможно, то декораторы могут обеспечить асинхронную инициализацию, расширяя конструктор.

function withAsyncInit(originalConstructor) {
  return function (...args) {
    const instance = new originalConstructor(...args);
    if (instance.init) {
      instance.init();
    }
    return instance;
  };
}

Миксины для добавления асинхронной логики

Миксины: Используйте преимущества миксинов при работе с асинхронными операциями в составе объектов, точно контролируя выполнение асинхронного кода.

Полезные материалы

1. Использование промисов – JavaScript | MDN — базовые принципы работы с промисами в JavaScript.
2. async function – JavaScript | MDN — обзор использования async.
3. Promise.all с Async/Await | Tania Rascia — использование Promise.all совместно с async/await.
4. Классы — полностью оспаривает концепцию классов в JavaScript ES6.
5. Async/await — вдумчивое руководство о async/await.