Question

[Solved] Wait 5 seconds before executing next line

This function below doesn’t work like I want it to; being a JS novice I can’t figure out why.

I need it to wait 5 seconds before checking whether the newState is -1.

Currently, it doesn’t wait, it just checks straight away.

function stateChange(newState) {
  setTimeout('', 5000);

  if(newState == -1) {
    alert('VIDEO HAS STOPPED');
  }
}

Solution #1:

You have to put your code in the callback function you supply to setTimeout:

function stateChange(newState) {
    setTimeout(function () {
        if (newState == -1) {
            alert('VIDEO HAS STOPPED');
        }
    }, 5000);
}

Any other code will execute immediately.

Respondent: Joseph Silber

Solution #2:

Here’s a solution using the new async/await syntax.

Be sure to check browser support as this is a language feature introduced with ECMAScript 6.

Utility function:

const delay = ms => new Promise(res => setTimeout(res, ms));

Usage:

const yourFunction = async () => {
  await delay(5000);
  console.log("Waited 5s");

  await delay(5000);
  console.log("Waited an additional 5s");
};

The advantage of this approach is that it makes your code look and behave like synchronous code.

Respondent: Etienne Martin

Solution #3:

You really shouldn’t be doing this, the correct use of timeout is the right tool for the OP’s problem and any other occasion where you just want to run something after a period of time. Joseph Silber has demonstrated that well in his answer. However, if in some non-production case you really want to hang the main thread for a period of time, this will do it.

function wait(ms){
   var start = new Date().getTime();
   var end = start;
   while(end < start + ms) {
     end = new Date().getTime();
  }
}

With execution in the form:

console.log('before');
wait(7000);  //7 seconds in milliseconds
console.log('after');

I’ve arrived here because I was building a simple test case for sequencing a mix of asynchronous operations around long-running blocking operations (i.e. expensive DOM manipulation) and this is my simulated blocking operation. It suits that job fine, so I thought I post it for anyone else who arrives here with a similar use case. Even so, it’s creating a Date() object in a while loop, which might very overwhelm the GC if it runs long enough. But I can’t emphasize enough, this is only suitable for testing, for building any actual functionality you should refer to Joseph Silber’s answer.

Respondent: Mic

Solution #4:

If you’re in an async function you can simply do it in one line:

console.log(1);
await new Promise(resolve => setTimeout(resolve, 3000)); // 3 sec
console.log(2);

FYI, if target is NodeJS you can use this if you want (it’s a predefined promisified setTimeout function):

await setTimeout[Object.getOwnPropertySymbols(setTimeout)[0]](3000) // 3 sec
Respondent: Shl

Solution #5:

Use a delay function like this:

var delay = ( function() {
    var timer = 0;
    return function(callback, ms) {
        clearTimeout (timer);
        timer = setTimeout(callback, ms);
    };
})();

Usage:

delay(function(){
    // do stuff
}, 5000 ); // end delay

Credits: How to delay the .keyup() handler until the user stops typing?

Respondent: Avatar

Solution #6:

You should not just try to pause 5 seconds in javascript. It doesn’t work that way. You can schedule a function of code to run 5 seconds from now, but you have to put the code that you want to run later into a function and the rest of your code after that function will continue to run immediately.

For example:

function stateChange(newState) {
    setTimeout(function(){
        if(newState == -1){alert('VIDEO HAS STOPPED');}
    }, 5000);
}

But, if you have code like this:

stateChange(-1);
console.log("Hello");

The console.log() statement will run immediately. It will not wait until after the timeout fires in the stateChange() function. You cannot just pause javascript execution for a predetermined amount of time.

Instead, any code that you want to run delays must be inside the setTimeout() callback function (or called from that function).

If you did try to “pause” by looping, then you’d essentially “hang” the Javascript interpreter for a period of time. Because Javascript runs your code in only a single thread, when you’re looping nothing else can run (no other event handlers can get called). So, looping waiting for some variable to change will never work because no other code can run to change that variable.

Respondent: jfriend00

Solution #7:

Try this:

//the code will execute in 1 3 5 7 9 seconds later
function exec() {
    for(var i=0;i<5;i++) {
        setTimeout(function() {
            console.log(new Date());   //It's you code
        },(i+i+1)*1000);
    }
}
Respondent: Steve Jiang

Solution #8:

This solution comes from React Native’s documentation for a refresh control:

function wait(timeout) {
    return new Promise(resolve => {
        setTimeout(resolve, timeout);
    });
}

To apply this to the OP’s question, you could use this function in coordination with await:

await wait(5000);
if (newState == -1) {
    alert('Done');
}
Respondent: bearacuda13

Solution #9:

Best way to create a function like this for wait in milli seconds, this function will wait for milliseconds provided in the argument:

function waitSeconds(iMilliSeconds) {
    var counter= 0
        , start = new Date().getTime()
        , end = 0;
    while (counter < iMilliSeconds) {
        end = new Date().getTime();
        counter = end - start;
    }
}

Solution #10:

You can add delay by making small changes to your function ( async and await ).

const addNSecondsDelay = (n) => {
  return new Promise(resolve => {
    setTimeout(() => {
      resolve();
    }, n * 1000);
  });
}

const asyncFunctionCall = async () {

  console.log("stpe-1"); 
  await addNSecondsDelay(5);
  console.log("step-2 after 5 seconds delay"); 

}

asyncFunctionCall();
Respondent: p.durga shankar

Solution #11:

Based on Joseph Silber’s answer, I would do it like that, a bit more generic.

You would have your function (let’s create one based on the question):

function videoStopped(newState){
   if (newState == -1) {
       alert('VIDEO HAS STOPPED');
   }
}

And you could have a wait function:

function wait(milliseconds, foo, arg){
    setTimeout(function () {
        foo(arg); // will be executed after the specified time
    }, milliseconds);
}

At the end you would have:

wait(5000, videoStopped, newState);

That’s a solution, I would rather not use arguments in the wait function (to have only foo(); instead of foo(arg);) but that’s for the example.

Respondent: Sylhare

Solution #12:

using angularjs:

$timeout(function(){
if(yourvariable===-1){
doSomeThingAfter5Seconds();
}
},5000)
Respondent: Dr. Abbos

Solution #13:

setTimeout(function() {
     $('.message').hide();
}, 5000);

This will hide the ‘.message’ div after 2 seconds.

Respondent: hackernewbie

Solution #14:

Create new Js function

function sleep(delay) {
        var start = new Date().getTime();
        while (new Date().getTime() < start + delay);
      }

Call the function when you want to delay execution. Use milliseconds in int for delay value.

####Some code
 sleep(1000);
####Next line

Solution #15:

I used it to run PC games from Edge or IE. And both self closes after 7 seconds.

Firefox and Google Chrome cannot be used to start games this way.

    <html>
    <body>
    <a href="E:gamegame.exe" name="game" onmouseout="waitclose(7000);"> game
    <img src="game.jpg" width="100%" height="97%" ></a>
    <script>
    function waitclose(ms){
     var start = new Date().getTime();var end=start;
     while(end < start + ms) {end = new Date().getTime();}
    window.open('', '_self', ''); window.close();
    }
    </script>
    </body>
    </html>
Respondent: user4565320

The answers/resolutions are collected from stackoverflow, are licensed under cc by-sa 2.5 , cc by-sa 3.0 and cc by-sa 4.0 .

Most Popular

To Top
India and Pakistan’s steroid-soaked rhetoric over Kashmir will come back to haunt them both clenbuterol australia bossier man pleads guilty for leadership role in anabolic steriod distribution conspiracy