Promise sinhronajā stilā JavaScript

Lai atrisinātu promise hell problēmu, tika izdomāta speciāla promise sintakse, kas ļauj rakstīt asinhrono kodu daudz vienkāršāk - sinhronajā stilā.

Sāksim to apgūt. Vispirms paņemsim kodu no iepriekšējās nodarbības:

javascriptfunction func() {
  getSmth(2).then(res => {
    console.log(res); // izvadīs 4
  });
}

func();

Ja mūsu funkcija getSmth būtu sinhrona, tad funkcijas func kodu mēs varētu pārrakstīt šādi:

javascriptfunction func() {
  let res = getSmth(2);
  console.log(res); // izvadīs 4
}

Funkcija getSmth tomēr ir asinhrona, tāpēc iepriekš minētais kods nedarbosies. Bet, izmantojot promise sinhrono stilu, mēs varam iegūt kaut ko līdzīgu. Darīsim to.

Vispirms mums jādeklarē mūsu funkcija func kā asinhrona, izmantojot speciālo komandu async:

javascriptasync function func() {
  
}

Pēc tam mēs varēsim funkcijas func iekšienē izmantot speciālo komandu await. Šī komanda, rakstīta pirms promise, liks JavaScript gaidīt līdz brīdim, kad promise tiks izpildīts. Pēc tam komanda atgriezīs promise rezultātu, un koda izpilde turpināsies.

Mūsu gadījumā mums jāraksta await pirms getSmth izsaukšanas. Tā kā šīs funkcijas izsaukuma rezultāts būs promise, tad tālāka koda izpilde turpināsies tikai pēc šī promise izpildes. Un promise rezultātu var ierakstīt mainīgajā. Darīsim aprakstīto:

javascriptasync function func() {
  let res = await getSmth(2);
  console.log(res); // izvadīs 4
}

func();

Izsauksim getSmth vairākas reizes:

javascriptasync function func() {
  let res1 = await getSmth(2);
  let res2 = await getSmth(3);
  
  console.log(res1 + res2); // izvadīs 13
}

func();

Un tagad izsauksim getSmth cilpā:

javascriptasync function func() {
  let arr = [1, 2, 3, 4, 5];
  let sum = 0;
  
  for (let elem of arr) {
    sum += await getSmth(elem);
  }
  
  console.log(sum);
}

func();

javascriptfunction func() {
  getSmth(2).then(res1 => {
    getSmth(3).then(res2 => {
      getSmth(4).then(res3 => {
        console.log(res1 + res2 + res3);
      });
    });
  });
}

func();