谁能解释一下以下代码和javascript的行为
for(var i = 0; i < 5; i++)
{
setTimeout(function(){
document.write('Iteration ' + i + ' <br>');
},1000);
}
document.write('DONE!');
为什么打印“完成！”第一的？ 它不应该打印循环的所有值然后打印'DONE！'吗？
【问题讨论】：
for-loop 完成后正在打印..
标签： javascript asynchronous synchronous
正常的 Javascript 是 Synchronous 逐行执行，但通过代码更改，您有时可以作为异步执行，但它实际上不会在单独的线程上执行。
好的，如果你想在 Document.write 完成后打印Done 怎么办
length = 0;
for(var i = 0; i < 5; i++)
{
setTimeout(function(index){
console.log('Iteration ' + index + ' <br>');
length++;
callback();
}(i),1000);
}
function callback(){
if(length == 5)
console.log('DONE!');
}
我们在这里所做的是递增计数器，并在每次递增后尝试调用回调，当计数器达到 5 时，这意味着所有 5 个函数都被调用，然后我们能够打印 Done。
作为一个侧面和重要的说明，您试图打印 0, 1, 2, 3, 4 但实际上当您运行代码时，它会给您 5, 5, 5, ,5, 5 因为您写 @ 987654325@ 和 i 在您打印时达到 5，这就是它退出 for 循环的原因，但您注意到我添加的代码，我将 i 作为参数传递给函数，以便保存我们的值以及执行函数的时间将写入 0, 1, 2, 3, 4
【讨论】：
为什么打印“完成！”第一的？它不应该打印循环的所有值然后打印'DONE！'吗？
不，您已经明确告诉它不要这样做；相反，您刚刚创建了五个函数并调用了五次 setTimeout 以将它们提供给浏览器以便稍后调用。
这段代码：
setTimeout(function(){
document.write('Iteration ' + i + ' <br>');
},1000);
调用函数setTimeout，传入你看到的函数。该函数当时不被调用。它刚刚创建。 setTimeout稍后会调用它，就像它的工作一样。 （当它这样做时，它会炸掉文档，因为在页面的主要解析完成后调用document.write 会隐式执行document.open，这会清除之前的文档。）
以下是该代码发生的情况：
i 已创建。0。setTimeout 时传入该函数对象的引用以及值 1000。i 递增。1、2、3 和 4（i）的值重复第 2 步到第 5 步。document.write 使用值 'DONE!' 调用
document.write，它隐式执行document.open，将现有文档吹走并替换为Iteration 5 <br>（是的，真的是5）。我们看到Iteration 5 五次而不是Iteration 0，然后是Iteration 1 等的原因是这些函数对变量 i 有一个持久的引用，而不是它在创建时的值，所以它们都在稍后读取它的值，直到它们运行时。
【讨论】：