Необходимость асинхронности
Асинхронный процесс — это процесс, выполнение которого требует времени. Он должен дождаться завершения работы, чтобы что-то вернуть.
Например, функция fetchData присваивает значение данным (например, извлекает данные с сервера), а displayData отображает полученные данные.
Когда мы запускаем этот фрагмент, мы получаем «undefined» вместо фактических данных.
Это происходит потому, что displayData не ждет готовности данных перед их отображением. Функции должны быть асинхронно связаны, чтобы получить желаемый результат.
Обработка асинхронных событий
Существует несколько способов обработки асинхронных задач в Javascript.
Асинхронный обратный вызов
Функция обратного вызова – это функция, которая передается в качестве аргумента другой функциис намерением "вызвать" ее позже.
DisplayData можно превратить в функцию обратного вызова следующим образом:
В приведенном выше фрагменте функция отображения данных передается в качестве аргумента функции fetchData. fetchData выполнит его, когда придет время.
Примером обратного вызова, который мы обычно используем, является EventListener.
Прослушиватель событий
Обратные вызовы теперь заменяются промисами и асинхронными/ожидающими.
Обещание
Promise — это объект JavaScript, который обеспечивает более чистый способ связывания асинхронных событий. Обещание определяется следующим образом:
Штаты
Состояние обещания по умолчанию (и начальное) — «ожидание». Ожидание — это в основном состояние ожидания завершения задания. В зависимости от условий обещание может быть успешно «разрешено/выполнено» или «отклонено» в случае неудачи.
Связывание
.then(), .catch() и .finally() используются для связывания следующих действий, которые должны произойти, когда обещание выполнено или отклонено.
Чтобы цепочка работала правильно, функция всегда должна возвращать обещание. Обратитесь к приведенному ниже примеру для правильного использования.
Распространенным примером цепочки промисов является Fetch API.
Обработка нескольких промисов
Javascript предоставляет несколько методов для работы с несколькими промисами. Мы подробно рассмотрим каждый из них в отдельной статье.
В настоящее время для асинхронных операций используются функции-оболочки async/await.
Асинхронно/ожидание
Async/Await — это более чистый способ обработки промисов. Функция с префиксом asyncвсегда возвращает обещание.
Мы можем разрешить или отклонить обещание в нашей асинхронной функции следующим образом:
Зачем ждать?
Await используется с асинхронным режимом, чтобы убедиться, что мы ждем, пока обещание не будет установлено (разрешено или отклонено). Ожидание допустимо только при использовании внутри асинхронной функции.
Мы можем изменить наш предыдущий пример Fetch API, используя async/await следующим образом:
Мы будем иметь дело с более асинхронным JS в будущих статьях.
