Введение в асинхронный JavaScript
Обычно коды JavaScript выполняются синхронно, а синхронные операции ждут завершения предыдущих операций независимо от того, сколько времени это займет. Но если мы сделаем эти операции, асинхронные операции могут выполняться вместе друг с другом и выполнять задачи без ожидания. В этой статье я собираюсь объяснить, как мы можем использовать функции обратного вызова, асинхронное ожидание и обещания для выполнения асинхронных операций в JavaScript.
Функции обратного вызова
Функции обратного вызова могут быть переданы в другую функцию в качестве параметра, и она будет выполнена после завершения первой функции. Также функции обратного вызова могут быть названы функциями анонимных функций. Например,
Функция setInterval принимает в качестве входных параметров функцию обратного вызова и продолжительность времени. Здесь анонимная функция обратного вызова передается в функцию setInterval.
В этом примере я передал ссылку MyFunction1 в качестве параметра MyFunction2 и сделал обратный вызов. Важно помнить, что передача функции в качестве параметра не вызовет вашу функцию.
На данный момент наш фрагмент кода выглядит нормально. Но что произойдет, если внутри каждой будет вложено несколько функций обратного вызова?
Когда функции становятся сложными, становится намного сложнее, и это известная проблема в функциях обратного вызова, известная как ад обратного вызова. Чтобы решить эту проблему, были введены обещания.
Обещания
Проще говоря, обещание - это что-то вроде оператора if-else. Но в обещании есть много отличительных черт. Как я упоминал ранее, javascript не дожидается полного выполнения блока асинхронного кода. Это поведение необходимо обрабатывать специально в таких сценариях, как отправка запросов API к серверам, поскольку мы не знаем статус сервера или время, необходимое для возврата ответа. Используя обещания, мы можем легко справиться с такими сценариями. Обещание позволяет нам удерживать выполнение блока кода до тех пор, пока асинхронный запрос не будет завершен.
Обещания имеют 3 состояния.
- В ожидании: исходное состояние перед началом операции.
- Выполнено: когда указанная операция была завершена.
- Отклонено: когда операция не была завершена; обычно выдается ошибка
Мы можем создать объект обещания с помощью ключевого слова new, внутри которого есть две функции обратного вызова: resolve и reject. Когда исполнитель получит результат, рано или поздно, неважно, он должен вызвать один из этих обратных вызовов:
- resolve (значение) - если задание завершено успешно, со значением результат. В этом состоянии обещание выполнено.
- reject (error) - если произошла ошибка, объект err * или является объектом error. В этом состоянии обещание отклонено.
Давайте создадим обещание ……
Чтобы использовать это обещание, мы можем легко связать .then () и .catch () следующим образом:
Когда мы вызываем buyCar (), функция .then () получает функцию с аргументом, который является значением разрешения нашего обещания. .catch () возвращает значение отклоненного нашего обещания.
Если вы собираетесь использовать обещания в вызовах API, есть пакеты npm, такие как обещание, запрос-обещание и многие другие, которые мы можем использовать, чтобы упростить задачу.
Асинхронный - Ожидание
Во-первых, давайте посмотрим, что такое асинхронная функция. Простая асинхронная функция - это способ, с помощью которого мы можем более легко написать обещание. Асинхронная функция всегда возвращает обещание, и если функция возвращает значение, это значение будет разрешено обещанием, и если функция вернет ошибку, оно будет отклонено.
Как я объяснил, обе эти функции равны и решают: «Это хорошая машина». То же самое, когда обещание отклоняется. Функция async выдаст ошибку.
Мы всегда используем ключевое слово AWAIT внутри асинхронной функции, и причина этого в том, что нам нужно убедиться, что обещания, возвращаемые в асинхронной функции, синхронизированы. Await исключает использование обратных вызовов в .then () и .catch (). При использовании async и await, async добавляется в начале при возврате обещания, а await добавляется в начале при вызове обещания.
Это всего лишь обзор этих трех концепций, и эти функции очень полезны, когда дело касается запросов API и обработки событий.
