Защо беше въведена конструкцията async/await и как подобрява работата с асинхронен код?

Async/await беше въведен, за да опрости писането на асинхронен код, като го направи по-лесен за четене и поддръжка в сравнение с традиционните callback-и или promises.

Как подобрява:

1. Четливост: Кодът с async/await изглежда като синхронен, ред по ред, което значително улеснява разбирането му.
2. Обработка на грешки: Позволява използването на стандартни конструкции като try/catch за обработка на грешки в асинхронния код, за разлика от .catch() при promises.
3. Дебъгване: Точките за спиране (breakpoints) работят по същия начин като при синхронен код, улеснявайки процеса на дебъгване.
4. По-малко "callback hell": Премахва проблема с вложените callback-и, които водят до трудно четим код.

Пример:

Код с promises:

// Пример с promises
fetch('https://api.example.com/data')
  .then(response => response.json())
  .then(data => {
    console.log(data);
  })
  .catch(error => {
    console.error('Грешка при извличане на данни:', error);
  });

Същият код с async/await:

// Пример с async/await
async function fetchData() {
  try {
    const response = await fetch('https://api.example.com/data');
    const data = await response.json();
    console.log(data);
  } catch (error) {
    console.error('Грешка при извличане на данни:', error);
  }
}

fetchData();

Конструкцията async/await е базирана на promises и е синтактичен захар за работа с тях. Функцията, маркирана като async, винаги връща promise. Операторът await може да се използва само вътре в async функции и "чака" изпълнението на promise, връщайки неговата разрешена стойност или генерирайки изключение в случай на грешка.