下面的这个功能不像我想要的那样工作;作为一个 JS 新手,我不明白为什么。
我需要它等待 5 秒钟,然后再检查是否newState
是-1
.
目前,它不会等待,它会立即检查。
function stateChange(newState) {
setTimeout('', 5000);
if(newState == -1) {
alert('VIDEO HAS STOPPED');
}
}
下面的这个功能不像我想要的那样工作;作为一个 JS 新手,我不明白为什么。
我需要它等待 5 秒钟,然后再检查是否newState
是-1
.
目前,它不会等待,它会立即检查。
function stateChange(newState) {
setTimeout('', 5000);
if(newState == -1) {
alert('VIDEO HAS STOPPED');
}
}
你必须把你的代码放在你提供给的回调函数中setTimeout
:
function stateChange(newState) {
setTimeout(function () {
if (newState == -1) {
alert('VIDEO HAS STOPPED');
}
}, 5000);
}
任何其他代码将立即执行。
这是使用新的 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");
};
这种方法的优点是它使您的代码看起来和行为类似于同步代码。
您真的不应该这样做,正确使用超时是解决 OP 问题以及您只想在一段时间后运行某些内容的任何其他场合的正确工具。Joseph Silber 在他的回答中很好地证明了这一点。但是,如果在某些非生产情况下,您确实希望将主线程挂起一段时间,则可以这样做。
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 的回答。
如果你在一个异步函数中,你可以简单地在一行中完成:
console.log(1);
await new Promise(resolve => setTimeout(resolve, 3000)); // 3 sec
console.log(2);
仅供参考,如果目标是 NodeJS,您可以根据需要使用它(这是一个预定义的 promisified setTimeout 函数):
await setTimeout[Object.getOwnPropertySymbols(setTimeout)[0]](3000) // 3 sec
使用这样的延迟函数:
var delay = ( function() {
var timer = 0;
return function(callback, ms) {
clearTimeout (timer);
timer = setTimeout(callback, ms);
};
})();
用法:
delay(function(){
// do stuff
}, 5000 ); // end delay