Question

此循环大约需要1.5秒。

console.time("test")
for (let i = 0; i < 1000000000; i++) {}
console.timeEnd("test")

我的问题是...

setTimeout(() => {
  for (let i = 0; i < 1000000000; i++) {}
  console.log("banana");
}, 2000);

setTimeout(() => {
  for (let i = 0; i < 1000000000; i++) {}
  console.log("apple");
}, 2000);

setTimeout(() => {
  for (let i = 0; i < 1000000000; i++) {}
  console.log("mango");
}, 2000);


console.log("finished")

每个setTimeOut（）花费2秒，但每个战利品花费1.5秒。
所以我应该得到

finished!
// 2 secs later
banana 
apple 
mango (all at once)

但是输出是

finished
// 2s later
 banana
  // 1.5s later
 apple
  // 1.5s later
 mango

Answer 1

您应该观看此视频https://www.youtube.com/watch?v=8aGhZQkoFbQ，该视频详细说明了问题/行为。

简而言之： setTimeout将把所有循环放在“事件回调”队列上。现在，如果延迟已经过去，它将一个接一个地执行循环并执行它们。但是，由于一个循环需要1.5秒的运行时间，因此这1.5秒将阻止其他所有程序运行，因为在JS中，所有代码（不包括网络api）都将在主事件循环中执行：

Programm start: 
loop1 => gets put into Event Callqueue (takes some milliseconds)
loop2 => gets put into Event Callqueue (takes some milliseconds)
loop3 => gets put into Event Callqueue (takes some milliseconds)
finalized is outputted. 

after 2000 milliseconds (as set in setTimout): 
loop1 => gets taken from queue and executed in the main event loop = takes 1,5 senconds and this blocks everything!
loop2 => the same... takes 1,5 seconds to execute 
loop3 => the same... takes 1,5 seconds to execute

JS只能对某些特殊的外部API“并行”执行代码。大多数代码在主事件循环中依次执行！了解这一概念绝对重要。

如果您正在寻找“ JavaScript中的线程”，那么Webworkers可能是一个很好的选择/解决方案。它们允许在后台并行执行JS。

javascript中的异步编程是什么意思？

1 个答案: