How can I print value each second in for loop JS?

Question

I have the code:

function sleep(ms){
        return new Promise(function(resolve,reject){
            setTimeout(function(){
                resolve();
            },ms)
        });
    }
let str = 'abcdef';
for(let i=0;i<str.length;i++){
   sleep(1000);
   console.log(str[i]);
}

How can I print str[i] each 1 second? This is code example, setInterval don't solve my problem!

Answer 1

Using ES7, you can wrap your for loop in an async function that waits for the sleep promise to be resolved.

function sleep(ms){
  return new Promise(function(resolve,reject){
setTimeout(resolve, ms)
  });
}
    
let str = 'abcdef';

async function loop(){
  for(let i = 0; i < str.length; i++) {
await sleep(1000);
console.log(str[i]);
  }
}

loop()

Of course, you can make this function more flexible passing the string you want to loop over as argument.

function sleep(ms){
  return new Promise(function(resolve,reject){
setTimeout(resolve, ms)
  });
}
    
async function logSlowly(string){
  for(let i = 0; i < string.length; i++) {
await sleep(1000);
console.log(string[i]);
  }
}

logSlowly('abcdef')

Answer 2

    let str = 'abcdef';
    for(let i=0;i<str.length;i++){
       setTimeout(function() {
         console.log(str[i])
    }, 1000 * i)
    }

Answer 3

const str = 'mystring';
const printEveryOneSecond = (s) => {
  for (let i = 0; i < s.length; i++) {
      setTimeout( () =>{
        console.log(s[i])
      }, i * 1000)
    }
}
printEveryOneSecond(str);

Answer 4

I was thinking about the solution what you made. I guess what solves your issue is the following code snippet:

(function () {
   let str = 'abcdef';
   let timing = 0;
   let printCharWithDelay = (character, timing) => {
      setTimeout(function() {
         console.log(character);
      }, timing);
   };
   
   for(let i = 0; i < str.length; i++) {
      printCharWithDelay(str[i], timing);
      timing += 1000;
   }
})();

I have completely restructured your code, if you run it you will have the required result.

Basically the code delays printing the passed character with the calculated milliseconds. Obviously it can be simplified but this is a good example to understand how setTimeout behaves in this scenario.

To read further about window setTimeout() method follow the link here.

Answer 5

Try to call sleep with await in front. Like this:

await sleep(1000);

Please use the search function befor posting duplicates here

To use the rigth functionaly please take a look to the dokumentation at this link here