Sobes.tech
Middle

Ako pracujete s asynchrónnym JavaScriptom?

sobes.tech AI

Odpoveď od AI

S asynchrónnosťou v JavaScripte pracujem pomocou callbackov, sľubov a async/await.

Callbacky sú funkcie, ktoré sa odovzdávajú do iných funkcií ako argumenty a vykonávajú sa po dokončení nejakej operácie. Môžu viesť k "pekelným callbackom" pri vnorení.

// Príklad callbacku
function fetchData(callback) {
  setTimeout(() => {
    callback("Dáta získané");
  }, 1000);
}

fetchData((data) => {
  console.log(data); // Vypíše "Dáta získané" po 1 sekunde
});

Sľuby sú objekty, ktoré predstavujú konečné dokončenie alebo neúspech asynchrónnej operácie. Uľahčujú prácu s asynchrónnym kódom, umožňujú vyhnúť sa hlbokému vnoreniu. Majú tri stavy: pending (čaká), fulfilled (úspešne splnené), rejected (zamietnuté).

// Príklad sľubu
function fetchDataPromise() {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve("Dáta získané");
    }, 1000);
  });
}

fetchDataPromise()
  .then((data) => {
    console.log(data); // Vypíše "Dáta získané" po 1 sekunde
  })
  .catch((error) => {
    console.error("Chyba:", error);
  });

Async/await je syntaktický cukor nad sľubmi, ktorý robí asynchrónny kód čitateľnejším, podobným synchronnému. Funkcia označená async vždy vracia sľub. Operátor await možno použiť iba vo vnútri async funkcie a pozastavuje vykonávanie, kým sľub nebude splnený (resolved) alebo zamietnutý (rejected).

// Príklad async/await
async function fetchDataAsync() {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve("Dáta získané");
    }, 1000);
  });
}

async function processData() {
  try {
    const data = await fetchDataAsync();
    console.log(data); // Vypíše "Dáta získané" po 1 sekunde
  } catch (error) {
    console.error("Chyba:", error);
  }
}

processData();

Často používam async/await pri práci s API požiadavkami, pretože je to najpohodlnejší a najčitateľnejší spôsob spracovania asynchrónnych operácií. Pri potrebe paralelného vykonávania viacerých asynchrónnych operácií používam Promise.all() alebo Promise.allSettled().

Používam event loop na pochopenie poradia vykonávania asynchrónneho kódu, mikroúloh a makroúloh.