JavaScript တွင် လက်ရှိပုံစံဖြင့် Promises များ

Promise hell ပြဿနာကိုဖြေရှင်းရန် လက်ရှိပုံစံတွင် အလွယ်တကူရေးသားနိုင်သည့် Promises ၏ အထူးဖွဲ့စည်းပုံကို တီထွင်ခဲ့သည် - ၎င်းသည် လက်ရှိပုံစံဖြင့် asynchronous ကုဒ်ကိုရေးသားရန် ခွင့်ပြုပါသည်။

၎င်းကို လေ့လာခြင်းဖြင့် စတင်ကြပါစို့။ အစပိုင်းတွင် ယခင် သင်ခန်းစာမှ ကုဒ်ကိုယူပါမည်။

javascriptfunction func() {
  getSmth(2).then(res => {
    console.log(res); // 4 ကိုပြသမည်
  });
}

func();

ကျွန်ုပ်တို့၏ function getSmth သည် synchronous ဖြစ်ခဲ့လျှင် func function ၏ ကုဒ်ကို အောက်ပါအတိုင်း ပြန်ရေးနိုင်မည်ဖြစ်သည်။

javascriptfunction func() {
  let res = getSmth(2);
  console.log(res); // 4 ကိုပြသမည်
}

သို့သော် getSmth function သည် asynchronous ဖြစ်သောကြောင့် အထက်ဖော်ပြပါ ကုဒ်သည် အလုပ်မလုပ်ပါ။ သို့သော် Promises ၏ လက်ရှိပုံစံကိုအသုံးပြုခြင်းဖြင့် အလားတူအရာတစ်ခုကို ကျွန်ုပ်တို့ရရှိနိုင်သည်။ ဤသို့လုပ်ဆောင်ကြပါစို့။

အစပိုင်းတွင် ကျွန်ုပ်တို့သည် ကျွန်ုပ်တို့၏ function func ကို အထူး command async ကိုအသုံးပြု၍ asynchronous အဖြစ် ကြေညာရပါမည်။

javascriptasync function func() {
  
}

ထို့နောက် func function အတွင်း အထူး command await ကို အသုံးပြုနိုင်မည်ဖြစ်သည်။ Promise ရှေ့တွင်ရေးထားသော ဤ command သည် Promise ပြီးမြောက်သည်အထိ JavaScript ကိုစောင့်ဆိုင်းစေပါမည်။ ထို့နောက် command သည် Promise ၏ရလဒ်ကို ပြန်ပေးပြီး ကုဒ်၏အလုပ်လုပ်ခြင်းကို ဆက်လက်လုပ်ဆောင်ပါမည်။

ကျွန်ုပ်တို့၏အခြေအနေတွင် getSmth ကိုခေါ်ယူခြင်းမပြုမီ await ကိုရေးရပါမည်။ ဤ function ကိုခေါ်ယူခြင်း၏ရလဒ်သည် Promise ဖြစ်သောကြောင့် ကုဒ်၏နောက်ထပ်လုပ်ဆောင်ခြင်းသည် ဤ Promise ပြီးမြောက်ပြီးမှသာ ဆက်လက်လုပ်ဆောင်ပါမည်။ ကောင်းပြီ၊ Promise ၏ရလဒ်ကို variable တစ်ခုထဲသို့ သိမ်းဆည်းနိုင်သည်။ ဖော်ပြထားသည့်အတိုင်း လုပ်ဆောင်ကြပါစို့။

javascriptasync function func() {
  let res = await getSmth(2);
  console.log(res); // 4 ကိုပြသမည်
}

func();

getSmth ကို အကြိမ်များစွာခေါ်ယူကြပါစို့။

javascriptasync function func() {
  let res1 = await getSmth(2);
  let res2 = await getSmth(3);
  
  console.log(res1 + res2); // 13 ကိုပြသမည်
}

func();

ယခု loop တစ်ခုအတွင်း getSmth ကိုခေါ်ယူကြပါစို့။

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();