Javascript : Как да чакам в цикъл?

И така, най-накрая сте в ситуация, в която искате да направите асинхронна задача в последователност вътре в цикъл и искате да изчакате асинхронната задача да завърши своя процес и след това да преминете към следващия елемент в списъка... нали?

Страхотен! Тогава сте на правилната страница.

Да приемем, че имаме масив [1, 2, 3]

let myitems = [1, 2, 3];

И да предположим, че трябва да извикаме една асинхронна функция за всеки елемент, която отнема 3 секунди за обработка и отговор.

Така че за това нека създадем една функция за забавяне с setTimeout, която ще извикаме в нашата асинхронна функция, за да създадем известно забавяне в отговора.

function delay(){
   return new Promise(){ resolve => setTimeout(resolve, 3000)
}

След това ще напишем нашата асинхронна функция с помощта на async-await и ще я наречем itemRunner.

async function itemRunner(item){
    await delay();
    console.log(item);
}

Сега, ако се опитате да използвате for цикъл в myitemsмасив и извикате itemRunner, той няма да изчака отговора на itemRunners. Той просто ще извика и ще премине към следващия път и ще отпечата 1,2,3 в конзолата след три секунди.

Но ние не искаме това. Искаме да обработим масива последователно и да изчакаме текущият елемент да завърши процеса си и след това да преминем към следващия елемент. За да постигнем това, ще трябва да обвием for..loopвътре във функцияasyncи след това можем да използваме awaitкоето ще постави на пауза нашата цикъл и изчакайте обещанието да се разреши. След като обещанието бъде разрешено, то ще премине към следващия елемент.

async function processTasks(array) {
  array.forEach(async (item) => {
    await itemRunner(item);
  })
  console.log('Completed!!!');
}

Горната функция ще отпечата всеки елемент след интервал от 3 секунди.

ето пълния кодов фрагмент..

let myitems = [1, 2, 3];
function delay(){
   return new Promise(){ resolve => setTimeout(resolve, 3000)
}
/* you actual processing function */
async function itemRunner(item){
    await delay();
    console.log(item);
}
/* here is how you can wait in loop */
async function processTasks(array) {
  array.forEach(async (item) => {
    await itemRunner(item);
  })
  console.log('Completed!!!');
}
processTasks(myitems);

Това е всичко!

Дано помогне. Благодаря за четенето.

Javascript : Как да чакам в цикъл?

Подобни въпроси