Рубрики
Без рубрики

Начало работы с Async / ждут в JavaScript

Узнайте, как функции async / a ждать упрощают асинхронный код.

Автор оригинала: AJ Meyghani.

Функция ASYNC/aNAIT является частью спецификации ES2017. Цель функций async/a a ждать состоит в том, чтобы упростить поведение с использованием обещаний синхронно. Вы можете создать Async Function, маркируя функцию async :

async function myFn() {
  return 5;
}

Когда называется Async функция, она возвращает Обещание Отказ Если ASYNC функция возвращает значение, Обещание будет решен с этим значением:

myFn().then(d => console.log(d)); // -> 5

Вы можете использовать ждать Оператор внутри async Функция для «паузы» функции до Обещание это помечено ждать решается:

async function getUserMessages() {
  const userInfo = await userService.getUserInfo(); // function waits here until data comes back
  const userMessages = messageService.getMessagesFor(userInfo.id); // now we can use the user id from the first call to get the messages.
  return userMessages; // userMessages is promise that will resolve with the list of messages.
}

getUserMessages().then(messages => console.log(messages));

Важно отметить, что, используя механизм Async/a enquav, мы не паузы с нитью JavaScript. Скорее, двигатель JavaScript делает асинхронно выполнение, пока результат не будет решен.

Рассвет гибели

Я уверен, что вы знакомы с вариантом этого типа кода, содержащего много вложенных обратных вызовов:

first(function (d1) {
  second(function (d2) {
    third(function(d3) {
      forth(function (d4) {
        console.log(d1 + d2 + d3 + d4);
      });
    });
  });
});

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

function all() {
  var r1;
  var r2;
  var r3;
  first()
  .then(function(d1) {
    r1 = d1;
    return second();
  })
  .then(function(d2) {
    r2 = d2;
    return third();
  })
  .then(function(d3) {
    r3 = d3;
    console.log(r1, r2, r3);
  });
}
all();

Глядя на то время, когда каждый звонок требует, вы можете сказать, как долго он примет, чтобы увидеть результат журнала:

  • Сначала () : 1 секунда
  • второй () : 2 секунды
  • В-третьих () : 3 секунды
  • Общее время: 1 + 2 + секунды

Список выше состоит в том, чтобы подчеркнуть, что каждое обещание должно быть решено, пока не перейдем к следующему. Вот почему всего займет 6 секунд, чтобы распечатать окончательное сообщение на консоль.

Введите async/ждать

Теперь использую async Функции и ждать Оператор мы можем переписать Все Функция выше:

async function all() {
  const r1 = await first(); // wait until the promise that first() returns is resolved
  const r2 = await second(); // wait until the promise that  second() returns is resolved
  const r3 = await third(); // wait until the promise that third() returns is resolved
  return [r1, r2, r3];
}
all().then(values => console.log(values));

Пару вещей, чтобы отметить здесь:

  • Все Функция отмечена async.
  • ждать Оператор делает паузу Все Функция до Обещание что его «ожидание» решено
  • Если функция помечена async , это вернет Обещание Отказ Глядя на Все Функция, мы возвращаем массив значений. Поэтому, когда мы называем Все , обещание, которое он возвращается, будет решен с массивом ценностей.

Обработка ошибок

Одним из способов обработки исключений с ASYNC функциями является использование попробовать блокировать:

async function run() {
  try {
    await f1();
    await f2();
    await f3();
  } catch(e) {
    // handle exception
  }
}

Существуют и другие способы обрабатывать ошибки с функциями Async/a ждать. Чтобы узнать больше о обработке ошибок, проверить это интересное Блог пост Отказ

Этот пост изначально опубликован автором здесь Отказ Эта версия была отредактирована для ясности и может появиться отличаться от исходного поста.

Читайте ещё по теме: