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。但我不能强调，这只适用于测试，建立任何实际功能，你应该参考Joseph Silber的答案。

Answer 3

以下是使用新async/await语法的解决方案。

请务必检查browser support，因为这是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

使用这样的延迟函数：

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

用法：

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

积分转到用户CMS，请参阅How to delay the .keyup() handler until the user stops typing?

Answer 5

你不应该只是尝试在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 6

如果您使用的是async function，则只需一行即可：

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

通知，如果目标是NodeJS，则使用它的效率更高（这是预定义的setTimeout函数）：

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

Answer 7

此解决方案来自React Native's documentation for a refresh control：

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

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

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

Answer 8

试试这个：

//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 9

您可以通过对函数进行少量更改（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 10

基于Joseph Silber的answer，我会这样做，更通用一点。

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

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);），但这是示例。

Answer 11

我用它从Edge或IE运行PC游戏。并在7秒钟后自动关闭IE Edge。

Firefox和Google Chrome无法以这种方式启动游戏。

<html<body>
<a href="E:\game\game.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>

Answer 12

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

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

Answer 13

创建新的Js功能

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

如果要延迟执行，请调用该函数。在int中使用毫秒作为延迟值。

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

Answer 14

使用angularjs：

$timeout(function(){
if(yourvariable===-1){
doSomeThingAfter5Seconds();
}
},5000)

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

14 个答案: