有没有比下面的pausecomp函数（取自此处）更好的方法来设计JavaScript中的睡眠？
function pausecomp(millis)
{
var date = new Date();
var curDate = null;
do { curDate = new Date(); }
while(curDate-date < millis);
}
这不是JavaScript中的Sleep的重复-动作之间的延迟；我希望在函数的中间有一个真正的睡眠，而不是在代码执行之前有一段延迟。
当前回答
我浏览了一天的解决方案，但我仍在思考如何在使用回调时保持可链接性。
每个人都熟悉传统的编程风格，即以同步的方式逐行运行代码。SetTimeout使用回调，因此下一行不会等待它完成。这让我思考如何使其“同步”，从而实现“睡眠”功能。
从一个简单的协同程序开始：
function coroutine() {
console.log('coroutine-1:start');
sleepFor(3000); // Sleep for 3 seconds here
console.log('coroutine-2:complete');
}
我想中间睡3秒钟，但我不想控制整个流程，所以协同程序必须由另一个线程执行。我考虑Unity Yield Instruction，并按以下方式修改协程：
function coroutine1() {
this.a = 100;
console.log('coroutine1-1:start');
return sleepFor(3000).yield; // Sleep for 3 seconds here
console.log('coroutine1-2:complete');
this.a++;
}
var c1 = new coroutine1();
声明sleepFor原型：
sleepFor = function(ms) {
var caller = arguments.callee.caller.toString();
var funcArgs = /\(([\s\S]*?)\)/gi.exec(caller)[1];
var args = arguments.callee.caller.arguments;
var funcBody = caller.replace(/^[\s\S]*?sleepFor[\s\S]*?yield;|}[\s;]*$/g,'');
var context = this;
setTimeout(function() {
new Function(funcArgs, funcBody).apply(context, args);
}, ms);
return this;
}
运行协同程序1（我在InternetExplorer11和Chrome49中进行了测试）后，您将看到它在两个控制台语句之间休眠3秒。它使代码与传统样式一样漂亮。
棘手的一点是在睡眠中。它将调用者函数体作为字符串读取，并将其分成两部分。拆下上部并通过下部创建另一个功能。等待指定的毫秒数后，它通过应用原始上下文和参数来调用创建的函数。对于原始流，它将像往常一样以“返回”结束。为了“收益”？它用于正则表达式匹配。这是必要的，但毫无用处。
它根本不是100%完美，但它至少实现了我的工作。我不得不提到使用这段代码时的一些限制。当代码被分成两部分时，“return”语句必须在外部，而不是在任何循环或{}中。即
function coroutine3() {
this.a = 100;
console.log('coroutine3-1:start');
if(true) {
return sleepFor(3000).yield;
} // <- Raise an exception here
console.log('coroutine3-2:complete');
this.a++;
}
上述代码一定有问题，因为所创建的函数中不能单独存在右括号。另一个限制是“var xxx=123”声明的所有局部变量都不能传递到下一个函数。您必须使用“this.xxx=123”来实现相同的目标。如果您的函数有参数，并且它们发生了更改，则修改后的值也无法传递到下一个函数。
function coroutine4(x) { // Assume x=abc
var z = x;
x = 'def';
console.log('coroutine4-1:start' + z + x); // z=abc, x=def
return sleepFor(3000).yield;
console.log('coroutine4-2:' + z + x); // z=undefined, x=abc
}
我将介绍另一个函数原型：waitFor
waitFor = function(check, ms) {
var caller = arguments.callee.caller.toString();
var funcArgs = /\(([\s\S]*?)\)/gi.exec(caller)[1];
var args = arguments.callee.caller.arguments;
var funcBody = caller.replace(/^[\s\S]*?waitFor[\s\S]*?yield;|}[\s;]*$/g,'');
var context = this;
var thread = setInterval(function() {
if(check()) {
clearInterval(thread);
new Function(funcArgs, funcBody).apply(context, args);
}
}, ms?ms:100);
return this;
}
它等待“check”函数，直到它返回true。它每100毫秒检查一次值。您可以通过传递额外的参数来调整它。考虑测试协程2：
function coroutine2(c) {
/* Some code here */
this.a = 1;
console.log('coroutine2-1:' + this.a++);
return sleepFor(500).yield;
/* Next */
console.log('coroutine2-2:' + this.a++);
console.log('coroutine2-2:waitFor c.a>100:' + c.a);
return waitFor(function() {
return c.a>100;
}).yield;
/* The rest of the code */
console.log('coroutine2-3:' + this.a++);
}
也是我们迄今为止喜爱的漂亮款式。实际上，我讨厌嵌套回调。很容易理解，协程2将等待协程1的完成。有趣的好的，然后运行以下代码：
this.a = 10;
console.log('outer-1:' + this.a++);
var c1 = new coroutine1();
var c2 = new coroutine2(c1);
console.log('outer-2:' + this.a++);
输出为：
outer-1:10
coroutine1-1:start
coroutine2-1:1
outer-2:11
coroutine2-2:2
coroutine2-2:waitFor c.a>100:100
coroutine1-2:complete
coroutine2-3:3
在初始化协程1和协程2后，立即完成外部。然后，协程1将等待3000毫秒。等待500毫秒后，子程序2将进入步骤2。之后，一旦检测到协程1.a值>100，它将继续执行步骤3。
请注意，有三种上下文可以保存变量“a”。一个是外部，值为10和11。另一个在协程1中，其值为100和101。最后一个在协程2中，其值为1、2和3。在协程2中，它还等待来自协程1的c.a，直到其值大于100。3个上下文是独立的。
复制和粘贴的完整代码：
sleepFor = function(ms) {
var caller = arguments.callee.caller.toString();
var funcArgs = /\(([\s\S]*?)\)/gi.exec(caller)[1];
var args = arguments.callee.caller.arguments;
var funcBody = caller.replace(/^[\s\S]*?sleepFor[\s\S]*?yield;|}[\s;]*$/g,'');
var context = this;
setTimeout(function() {
new Function(funcArgs, funcBody).apply(context, args);
}, ms);
return this;
}
waitFor = function(check, ms) {
var caller = arguments.callee.caller.toString();
var funcArgs = /\(([\s\S]*?)\)/gi.exec(caller)[1];
var args = arguments.callee.caller.arguments;
var funcBody = caller.replace(/^[\s\S]*?waitFor[\s\S]*?yield;|}[\s;]*$/g,'');
var context = this;
var thread = setInterval(function() {
if(check()) {
clearInterval(thread);
new Function(funcArgs, funcBody).apply(context, args);
}
}, ms?ms:100);
return this;
}
function coroutine1() {
this.a = 100;
console.log('coroutine1-1:start');
return sleepFor(3000).yield;
console.log('coroutine1-2:complete');
this.a++;
}
function coroutine2(c) {
/* Some code here */
this.a = 1;
console.log('coroutine2-1:' + this.a++);
return sleepFor(500).yield;
/* next */
console.log('coroutine2-2:' + this.a++);
console.log('coroutine2-2:waitFor c.a>100:' + c.a);
return waitFor(function() {
return c.a>100;
}).yield;
/* The rest of the code */
console.log('coroutine2-3:' + this.a++);
}
this.a = 10;
console.log('outer-1:' + this.a++);
var c1 = new coroutine1();
var c2 = new coroutine2(c1);
console.log('outer-2:' + this.a++);
它在Internet Explorer 11和Chrome 49中进行了测试。因为它使用arguments.callee，所以如果在严格模式下运行可能会有麻烦。
其他回答
Use:
等待新的Promise（resol=>setTimeout（resolve，2000））；
确保调用函数是异步的。这是经过验证的，工作正常。
实际上，您可以使用与pausecomp函数相同的while循环实现sleep（）（这基本上是相同的）：
const sleep = (seconds) => {
const waitUntil = new Date().getTime() + seconds * 1000
while(new Date().getTime() < waitUntil) {
// do nothing
}
}
您可以像这样使用sleep（）方法：
const main = () => {
const a = 1 + 3
// Sleep 3 seconds before the next action
sleep(3)
const b = a + 4
// Sleep 4 seconds before the next action
sleep(4)
const c = b + 5
}
main()
这就是我想象你会使用睡眠功能的方式，而且读起来相对简单。我借鉴了另一篇文章《JavaScript中的睡眠——动作之间的延迟》，以展示您可能打算如何使用它。
不幸的是，你的电脑会变热，所有工作都会受阻。如果在浏览器中运行，该选项卡将停止，用户将无法与页面交互。
如果您将代码重组为异步的，那么您可以将setTimeout（）作为与其他文章相同的睡眠函数。
// define sleep using setTimeout
const sleep = (seconds, callback) => setTimeout(() => callback(), seconds * 1000)
const main = () => {
const a = 1 + 3
let b = undefined
let c = undefined
// Sleep 3 seconds before the next action
sleep(3, () => {
b = a + 4
// Sleep 4 seconds before the next action
sleep(4, () => {
c = b + 5
})
})
}
main()
正如你所说，这不是你想要的。我修改了Sleep in JavaScript中的示例-动作之间的延迟，以说明为什么会出现这种情况。当您添加更多动作时，要么需要将逻辑拉入单独的函数，要么将代码嵌套得越来越深（回调地狱）。
为了解决“回调地狱”，我们可以使用promise来定义睡眠：
const sleep = (seconds) => new Promise((resolve => setTimeout(() => resolve(), seconds * 1000)))
const main = () => {
const a = 1 + 3
let b = undefined
let c = undefined
// Sleep 3 seconds before the next action
return sleep(3)
.then(() => {
b = a + 4
// Sleep 4 seconds before the next action
return sleep(4)
})
.then(() => {
c = b + 5
})
}
main()
Promise可以避免深度嵌套，但看起来仍然不像我们最初使用的常规同步代码。我们希望编写看起来同步的代码，但没有任何缺点。
让我们再次使用async/await重写我们的主方法：
const sleep = (seconds) => new Promise((resolve => setTimeout(() => resolve(), seconds * 1000)))
const main = async () => {
const a = 1 + 3
// Sleep 3 seconds before the next action
await sleep(3)
const b = a + 4
// Sleep 4 seconds before the next action
await sleep(4)
const c = b + 5
}
main()
使用async/await，我们可以调用sleep（），就好像它是一个同步的阻塞函数一样。这解决了您可能在其他帖子中使用回调解决方案时遇到的问题，并避免了长时间循环的问题。
这里大多数解决方案的问题是它们倒带堆栈。在某些情况下，这可能是一个大问题。在这个例子中，我展示了如何以不同的方式使用迭代器来模拟真实的睡眠。
在本例中，生成器正在调用自己的next（），因此一旦它启动，它就自己运行了。
var h = a();
h.next().value.r = h; // That's how you run it. It is the best I came up with
// Sleep without breaking the stack!!!
function *a(){
var obj = {};
console.log("going to sleep....2s")
setTimeout(function(){obj.r.next();}, 2000)
yield obj;
console.log("woke up");
console.log("going to sleep no 2....2s")
setTimeout(function(){obj.r.next();}, 2000)
yield obj;
console.log("woke up");
console.log("going to sleep no 3....2s")
setTimeout(function(){obj.r.next();}, 2000)
yield obj;
console.log("done");
}
内联函数：
(async () => await new Promise(resolve => setTimeout(resolve, 500)))();
500是VM在移动到下一行代码之前等待的时间（以毫秒为单位）。
tldr位；
基本上，当您创建一个promise时，它会在创建时返回一个可观察到的值，在回调中提供一个解析引用，用于在数据/响应可用时移交数据/响应。在这里，在500ms后通过setTimeOut调用resolve，直到未执行resolve之前，外部作用域正在等待进一步的处理，因此，创建了一个伪块。这与非阻塞（或调用其他语言中可用的非线程保留睡眠）完全不同，因为线程和最可能的UI以及网页/节点应用程序的任何其他正在进行的任务将被阻塞，而主线程将专门用于等待承诺解决。
setTimeout是JavaScript异步方法的一部分（开始执行的方法，其结果将在将来某个时候返回到一个名为回调队列的组件，稍后将执行）
您可能想做的是将setTimeout函数包装在Promise中。
承诺示例：
constsleep=time=>newPromise（res=>setTimeout（res，time，“已完成睡眠”））；//使用本机承诺sleep（2000）.then（msg=>console.log（msg））；
异步/等待示例：
constsleep=time=>newPromise（res=>setTimeout（res，time，“已完成睡眠”））；//在顶层使用异步/等待（异步函数（）{const msg=等待睡眠（2000）；console.log（消息）；})();
阅读有关setTimeout的更多信息
