27. Jaki jest cel użycia słów kluczowych 'async' i 'await' w JavaScript?

Zrozumienie słów kluczowych 'async' i 'await' w JavaScript

Słowa kluczowe async i await w JavaScript służą do łatwiejszej pracy z Promise i pisania czystszego kodu asynchronicznego. Słowa te są częścią ES2017 (ES8) i pomagają obsługiwać operacje asynchroniczne w sposób bardziej przypominający synchroniczny.

Jak działa 'async'

Słowo kluczowe async służy do definiowania funkcji asynchronicznej. Kiedy funkcja jest zadeklarowana z async, automatycznie zwraca Promise. Wykonanie funkcji async jest wstrzymywane przy każdym słowie kluczowym await, czekając na rozwiązanie Promise.

async function fetchData() {
  return 'Dane pobrane';
}

fetchData().then(result => console.log(result)); // Wyjście: Dane pobrane

Jak działa 'await'

Słowo kluczowe await można używać wewnątrz funkcji async, aby wstrzymać wykonanie funkcji do momentu rozwiązania Promise. Ułatwia to czytanie i pisanie kodu, eliminując potrzebę korzystania z metod .then() i .catch().

async function fetchData() {
  let dataPromise = new Promise((resolve, reject) => {
    setTimeout(() => resolve('Dane pobrane'), 1000);
  });

  let result = await dataPromise;
  console.log(result); // Wyjście: Dane pobrane
}

fetchData();

Korzyści

1. Czytelność: Kod z async i await jest bardziej czytelny i przypomina kod synchroniczny.
2. Obsługa błędów: Można używać bloków try i catch, co upraszcza zarządzanie błędami.
3. Unikanie piekła callbacków: Pomaga unikać głęboko zagnieżdżonych callbacków, co sprawia, że kod jest czystszy.

Ważne uwagi

• await działa tylko wewnątrz funkcji async.
• await wstrzymuje wykonanie funkcji, ale nie blokuje wykonywania innych operacji.
• Jeśli Promise zostanie odrzucony, zostaje zgłoszony błąd, który można przechwycić za pomocą bloków try-catch.

Podsumowując, async i await oferują potężny sposób na pisanie czystszego i bardziej zarządzalnego kodu asynchronicznego w JavaScript.