在执行下一行之前等待5秒

Question

下面的这个功能不像我想要的那样工作; 作为一个JS新手我无法弄清楚为什么.

我需要它等待5秒才能检查是否newState是-1.

目前,它不会等待,它只是立即检查.

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

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

Answer 1

您必须将代码放在您提供的回调函数中setTimeout:

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

任何其他代码将立即执行.

Answer 2

你真的不应该这样做,正确使用超时是OP问题的正确工具,以及任何其他你想在一段时间后运行的东西.约瑟夫西尔伯在他的回答中证明了这一点.但是,如果在某些非生产情况下你真的想挂主线程一段时间,那就可以了.

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

在表单中执行:

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

我来到这里是因为我正在构建一个简单的测试用例,用于对长时间运行的阻塞操作(即昂贵的DOM操作)的异步操作进行排序,这是我的模拟阻塞操作.它适合那种工作,所以我认为我发布给其他任何带有类似用例到达这里的人.即便如此,它还是在while循环中创建一个Date()对象,如果它运行得足够长,它可能会非常淹没GC.但我不能强调,这只适用于测试,建立任何实际功能,你应该参考约瑟夫西尔伯的答案.

Answer 3

这是使用新的async/await语法的解决方案.

请务必检查浏览器支持,因为这是ECMAScript 6引入的新功能.

辅助功能:

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

用法:

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

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

这种方法的优点是它使您的代码看起来和行为像同步代码.

Answer 4

你不应该只是尝试在javascript中暂停5秒.它不起作用.您可以安排代码函数从现在开始运行5秒,但是您必须将稍后要运行的代码放入函数中,并且该函数之后的其余代码将继续立即运行.

例如:

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

但是,如果您有这样的代码:

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

该console.log()声明将立即运行.它不会等到stateChange()函数超时触发后才会触发.你不能只是暂停javascript执行一段预定的时间.

相反,您要运行的任何代码都必须在setTimeout()回调函数内(或从该函数调用).

如果您尝试通过循环"暂停",那么您基本上会"挂起"Javascript解释器一段时间.因为Javascript只在一个线程中运行你的代码,所以当你循环时,其他任何东西都不能运行(不能调用其他事件处理程序).因此,循环等待某个变量进行更改将永远不会起作用,因为没有其他代码可以运行来更改该变量.

Answer 5

使用这样的延迟函数:

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

用法:

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

积分转到用户CMS,请参阅如何延迟.keyup()处理程序,直到用户停止输入？

Answer 6

如果您处于异步功能中,则只需在一行中执行:

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

请注意,如果target是NodeJS,使用它会更有效(它是预定义的promisified setTimeout函数):

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

Answer 7

此解决方案来自React Native 的刷新控件文档：

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

要将其应用于 OP 的问题，您可以配合使用此功能await：

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

Answer 8

如果你有一个异步函数，你可以这样做：

await new Promise(resolve => setTimeout(resolve, 5000));

Answer 9

创建这样的函数的最佳方法是等待毫秒,这个函数将等待参数中提供的毫秒:

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

Answer 10

试试这个:

//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);
    }
}

Answer 11

您可以通过对函数（ async 和 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();

Answer 12

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

这将在 5 秒后隐藏 '.message' div。

Answer 13

根据 Joseph Silber 的回答，我会这样做，更通用一点。

你会有你的功能（让我们根据问题创建一个）：

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

你可以有一个等待功能：

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

最后你会有：

wait(5000, videoStopped, newState);

这是一个解决方案，我宁愿不在等待函数中使用参数（只有foo();而不是foo(arg);），但这是示例。