Question

0

40

Vistas

how to resolve promise with delay in a loop without async/await?

I have a function called printLetters() which prints letters after 1000ms. I expected it to print letters one at a time with a 1000ms delay, but it prints all letters at once. It works when I convert it to the async function. However, how do I make printLetters() resolve each promise with delay without async/await?

const printLetters = (l) => {
  for (let i = 0; i < l.length; i++) {
    delay(1000).then(() => {
      console.log(l[i]);
      })
  }
}

const printLettersAsync = async(l) => {
   for (let i = 0; i < l.length; i++) {
    await delay(1000);
    console.log(l[i]);
      
  }
}

const delay = (t) => {
  return new Promise(res => setTimeout(res, t))
}

const arr = ['a','b','c']

printLetters(arr)
printLettersAsync(arr)

7 months ago · Juan Pablo Isaza

2 Respuestas

Responde la pregunta

0

Multiply the number you pass into delay by the iteration index.

const printLetters = (letters) => {
  for (let i = 0; i < letters.length; i++) {
    delay(1000 * i).then(() => {
      console.log(letters[i]);
      })
  }
}
const delay = (t) => {
  return new Promise(res => setTimeout(res, t))
}

const arr = ['a','b','c']

printLetters(arr)

But there isn't much point to a delay function that you pass a callback into - setTimeout is easier.

const printLetters = (letters) => {
  for (let i = 0; i < letters.length; i++) {
    setTimeout(() => console.log(letters[i]), i * 1000);
  }
}
const arr = ['a','b','c']
printLetters(arr)

7 months ago · Juan Pablo Isaza Denunciar

0

Responde la pregunta

Encuentra empleos remotos

Accepted Answer · 2022-07-03T06:44:08.157Z

To emulate await you need to convert your function into a recursive function. What this means is that you need to abandon the for loop and create your own looping code using recursion:

const printLoop = (l, callback) => {
  if (l.length > 0) {
    const letter = l.shift();
    console.log(letter);

    delay(1000).then(() => printLoop(l,callback)); // this is the loop
  }
  else {
    callback(); // we're done
  }
}

const printLetters = (l, cb) => {
  const letters = Array.from(l); // Copy the array
                                 // to avoid side effects.
                                 // This is optional but
                                 // included to retain similar
                                 // behavior to original code.
  printLoop(letters, cb);
}

const arr = ['a','b','c'];

printLetters(arr, () => console.log('done printing letters'));

This is what await does. It recompiles your code into a structure similar to the example above.