Аsync и Аwait синтаксис

Аsync и Аwait синтаксис
Photo by Semyon Borisov / Unsplash

Async/Await е синтаксис в JavaScript, който се използва за управление на асинхронен код. Когато извършваме асинхронни операции като изпращане на заявки към API или база данни, ни трябва начин да се уверим, че кодът, който следва, ще изчака тези операции да завършат преди да продължи напред.

С async/await, можем да създадем функции, които могат да се използват асинхронно и да върнат Promise. Когато използваме ключовата дума async преди дефиницията на функцията, това означава, че тя ще върне Promise. Когато използваме ключовата дума await вътре в тялото на функцията, това ни позволява да изчакаме, докато асинхронните операции вътре в нея завършат.

Ето пример:

async function getPosts() {
  const response = await fetch('https://example.com/posts');
  const posts = await response.json();
  return posts;
}

getPosts().then(posts => console.log(posts));

В този пример създаваме асинхронна функция getPosts(), която използва fetch() за извличане на публикации от определен API. Последващият оператор await за response.json() гарантира, че ще изчакаме, докато данните са готови, преди да върнем публикацийте. В резултат ще получим масив от публикации в конзолата.

Ето друг пример за асинхронна функция, която използва синтаксиса на async/await за обработка на Promise:

function getData() {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve("Data received!");
    }, 2000);
  });
}

async function main() {
  console.log("Start");
  try {
    const data = await getData();
    console.log(data);
    console.log("End");
  } catch (error) {
    console.error(error);
  }
}

main();

В този пример getData е функция, която връща Promise, който се изпълнява след 2 секунди и връща низ "Data received!".

Функцията main е декларирана като асинхронна с ключовата дума async. Тя използва ключовата дума await за изчакване на завършването на Promise от getData, който се връща. След това функцията извежда получените данни в конзолата и завършва.

По време на изпълнение, кодът извежда "Start", след това изчаква 2 секунди за изпълнението на Promise, след което извежда "Data received!" и "End". Ако Promise върне грешка, тя се хваща от блока catch и се извежда грешката в конзолата.