Sobes.tech
Middle

Kako radite sa asinhronim JavaScript-om?

sobes.tech АИ

Одговор од АИ

Radim sa asinhronim operacijama u JavaScript-u koristeći callback-ove, promise-ove i async/await.

Callback-ovi su funkcije koje se prosleđuju drugim funkcijama kao argumenti i izvršavaju se nakon završetka određene operacije. Mogu dovesti do "pakla callback-ova" pri ugnježdenju.

// Primer callback-a
function fetchData(callback) {
  setTimeout(() => {
    callback("Podaci primljeni");
  }, 1000);
}

fetchData((data) => {
  console.log(data); // Ispisaće "Podaci primljeni" nakon 1 sekunde
});

Promise-ovi su objekti koji predstavljaju završetak ili neuspeh asinhrone operacije. Olakšavaju rad sa asinhronim kodom, izbegavajući duboko ugnježdenje. Imaju tri stanja: pending (na čekanju), fulfilled (ispunjen), rejected (odbijen).

// Primer promise-a
function fetchDataPromise() {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve("Podaci primljeni");
    }, 1000);
  });
}

fetchDataPromise()
  .then((data) => {
    console.log(data); // Ispisaće "Podaci primljeni" nakon 1 sekunde
  })
  .catch((error) => {
    console.error("Greška:", error);
  });

Async/await je sintaktički šećer nad promise-ovima koji čini asinhroni kod čitljivijim, sličnim sinhronom. Funkcija označena sa async uvek vraća promise. Operator await može da se koristi samo unutar async funkcija i zaustavlja izvršenje dok se promise ne reši ili odbaci.

// Primer async/await
async function fetchDataAsync() {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve("Podaci primljeni");
    }, 1000);
  });
}

async function processData() {
  try {
    const data = await fetchDataAsync();
    console.log(data); // Ispisaće "Podaci primljeni" nakon 1 sekunde
  } catch (error) {
    console.error("Greška:", error);
  }
}

processData();

Često koristim async/await pri radu sa API zahtevima, jer je to najzgodniji i najčitljiviji način za obradu asinhronih operacija. Za paralelno izvršavanje više asinhronih operacija koristim Promise.all() ili Promise.allSettled().

Koristim event loop da razumem redosled izvršavanja asinhronog koda, mikrotaskova i makrotaskova.