Promise VS Async/Await

Този блог ще ви обясни Promise и Async/Await с пример.

Promises и async/await са механизми в JavaScript, използвани за работа с асинхронни операции. Те предоставят начин за управление и обработка на асинхронен код по по-организиран и четим начин. Ето кратко сравнение на двете:

Обещания:

Обещанията бяха въведени в ES6 (ECMAScript 2015) и предоставят начин за представяне на стойност, която може да не е налична все още, но ще бъде в някакъв момент в бъдещето.
Обещанията имат жизнен цикъл с три състояния: чакащи, изпълнени (разрешени) и отхвърлени. Те могат да бъдат в едно от тези състояния.
Обещанията използват метод .then() за обработка на успешна резолюция и метод .catch() за обработка на грешки.
Обещанията често се създават с помощта на конструктора new Promise() и вие предавате функция за обратно извикване, която получава функциите resolveи reject.
Обещанията могат да бъдат верижно свързани с помощта на множество .then()извиквания, което улеснява обработката на последователни асинхронни операции.

Пример за използване на Promises:

function fetchData() {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      if (Math.random() < 0.5) {
        resolve("Data fetched successfully");
      } else {
        reject("Error fetching data");
      }
    }, 1000);
  });
}

fetchData()
  .then((result) => {
    console.log(result);
  })
  .catch((error) => {
    console.error(error);
  });

2. Async/Await:

Async/await е по-ново допълнение към JavaScript (въведено в ES2017/ES8), което опростява работата с Promises и асинхронен код.
Ключовата дума asyncсе използва за дефиниране на функция като асинхронна, което ѝ позволява да използва ключовата дума awaitвътре. Ключовата дума awaitсе използва за спиране на изпълнението на функция, докато не бъде разрешено обещание, което прави кода да изглежда по-синхронен.
Async/await улеснява обработката на грешки с помощта на блокове try/catch, осигурявайки по-структуриран начин за справяне с асинхронни изключения.

Пример за използване на async/await:

async function fetchData() {
  try {
    const result = await new Promise((resolve, reject) => {
      setTimeout(() => {
        if (Math.random() < 0.5) {
          resolve("Data fetched successfully");
        } else {
          reject("Error fetching data");
        }
      }, 1000);
    });

    console.log(result);
  } catch (error) {
    console.error(error);
  }
}

fetchData();

Заключение:async/await е по-модерен и експресивен начин за работа с асинхронен код, надграждащ Promises. Той опростява обработката на асинхронни операции и управлението на грешки. Обещанията обаче все още се използват широко и осигуряват повече гъвкавост в някои случаи, когато трябва да извършвате по-сложни операции с асинхронен код.

Promise VS Async/Await

Подобни въпроси