[英]time delay between 2 lines of code in javascript, not settimeout
是否有一个函数可以在两行代码之间添加时间延迟。 不是 settimeout，因为 settimeout 在其参数中需要一个函数/对象。
我正在寻找类似这个伪代码的东西
write "abc";
delay(500);
write "xyz";
TIA
编辑：jimr 在我的另一个线程中的解决方案适用于我的目的，Robusto 的也是如此。
我只是想知道为什么 Robusto 和 CMS 的链接给出的“睡眠”方法不是首选。 这与 settimeout 方法有何不同，因为它们都在代码中引入了暂停？ （settimeout在函数执行前暂停，sleep方法在下一行执行前暂停。）
以下是笨拙和丑陋的，我永远不会在我自己的代码中这样做，我根本不推荐它，但它表明这样的事情是可能的。
// time arg is in milliseconds
function delay(time) {
var d1 = new Date();
var d2 = new Date();
while (d2.valueOf() < d1.valueOf() + time) {
d2 = new Date();
}
}
您可以使用 setTimeout 使代码几乎显示在两行上：
write('abc')
setTimeout(function() {
write('xyz')
},500)
sleep-Method 不可用，因为 JavaScript 执行会阻塞浏览器，所以 sleep-Method 会阻塞浏览器 500 毫秒，你真的想让你的浏览器半秒不响应吗？
按照建议使用 setTimeout。
在 JavaScript 1.7 中，将yield与async.js 结合使用，您可以执行以下操作：
var yourFunction = _(function () {
write("abc");
yield to.sleep(.500);
write("xyz");
});
我不知道你在这里想做什么，但这里有一个具体的原因，为什么自定义睡眠可能无法满足你的目的，假设浏览器冻结对你来说不是问题。
您是否有机会在这两个写入命令之间操作 DOM？ 如果是，那么它根本无法工作（如最终用户所感知的那样），尽管 DOM 节点将在内存中构建/更新，但显示不会更新，因为该部分不是同步的。 处理器被锁定在该循环中，当该循环完成时，两个 DOM 更新都将在屏幕上刷新。 请参阅此示例。
理想情况下，您应该在屏幕上看到“Hello”，并在 5 秒后看到“World”。 但是，在 Chrome、Safari 和 Firefox 上，您会在 5 秒结束时看到“Hello”和“World”。 控制台日志证明 DOM 节点是在内存中构建的，但直到最后才会在屏幕上刷新，如您所见。
据我所知， setTimeout()是唯一的方法。
function write(out) {
alert(out);
}
// ...
write('abc');
setTimeout(function() { write('xyz')}, 500);
ES6 引入了async/await ，可用于实际延迟。 我已经在另一篇文章中回答了这个问题，也只是在这里更新
异步函数可以包含一个 await 表达式，该表达式暂停异步函数的执行并等待传递的 Promise 的解析，然后恢复异步函数的执行并返回解析的值。
async function delay(delayInms) { return new Promise(resolve => { setTimeout(() => { resolve(2); }, delayInms); }); } async function sample() { console.log('a'); console.log('waiting...') let delayres = await delay(3000); console.log('b'); } sample();我也很想念 javascript，因为 Java SE 和 EE 爱好者没有我的sleep()让我对 JavaScript 感到失望，我做了一个计时器，希望它对你有用，它使用 jQuery，而且相当简单，你可以对其进行逆向工程并创建满足您需求的东西：
function timer(object, time) { $(object).attr({ 'onclick': '' }); if (time < 0) { $(object).attr({ 'onclick': "timer('#clock', 6000);" }); return; } $(object).animate({ opacity: 1 }, 1, function() { $(object).empty(); $(object).append(time + 'ms'); time--; timer(object, time); }); }
#clock { width: 65px; height: 20px; border: 1px solid #F00; text-align: center; line-height: 20px; background-color: #000; color: #FFF; font-weight: 900; }
<!DOCTYPE html> <html> <head> <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script> <title>HTML5, CSS3 and JavaScript demo</title> </head> <body> <div id="clock" onclick="timer('#clock',6000);">--s</div> </body> </html>
setInterval(function delay{ //loops every 300 milliseconds
setTimeout(function firstLineOfCode(){ //waits 100 milliseconds then runs code
write('abc');
},100)
setTimeout(function secondLineOfCode(){ //waits 200 milliseconds (100 after previous line) then runs code
write('def');
},200)
setTimeout(function thirdLineOfCode(){ //waits 300 milliseconds (100 after previous line) then runs code
write('ghi');
},300)
},300) //loops after total of delays in function delay()
您可以使用 JavaScript 中的异步等待概念添加延迟。
const add2SecondsDelay = () => {
return new Promise(resolve => {
setTimeout(() => {
resolve('added 2 seconds delay);
}, 20000);
});
}
async function asyncFunctionCall() {
console.log('abc'); // ------> first step
const result = await add2SecondsDelay();
console.log("xyz"); // ------> second step will execute after 2 seconds
}
asyncFunctionCall();
使用setTimeout（函数，延迟）的函数之间的JavaScript延迟
[英]JavaScript delay between functions using setTimeout(function, delay)
Javascript/React：调用setTimeout，延迟实时变化
[英]Javascript/React: Calling setTimeout with a delay changing in real time
为什么我的 JavaScript 循环延迟（使用 setTimeout）不修改变量？
[英]Why is my JavaScript loop with time delay (using setTimeout) not modifying variables?
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.