setTimeout面试连击

最新推荐文章于 2025-12-17 16:35:43 发布

原创最新推荐文章于 2025-12-17 16:35:43 发布 · 257 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#面试 #前端

面试同时被 2 个专栏收录

3 篇文章

订阅专栏

javascript

3 篇文章

订阅专栏

本文通过六道经典题目详细解析JavaScript中定时器与闭包的运用难点，特别是变量作用域与异步执行机制的问题，并提供解决方案。文章旨在帮助读者深入理解JavaScript中的闭包与异步执行机制。

第一击

for (var i = 0; i < 5; i++) {
  console.log(i);
}

答案： 0 1 2 3 4

第二击

for (var i = 0; i < 5; i++) {
  setTimeout(function() {
    console.log(i);
  }, 1000 * i);
}

答案： 5 5 5 5 5

第三击

怎么修改输出0 1 2 3 4

# 闭包模式   或者Es6的`let`
for (var i = 0; i < 5; i++) {
  (function(i) {
    setTimeout(function() {
      console.log(i);
    }, i * 1000);
  })(i);
}

第四击

for (var i = 0; i < 5; i++) {
  (function() {
    setTimeout(function() {
      console.log(i);
    }, i * 1000);
  })(i);
}

答案： 5 5 5 5 5

第五击


for (var i = 0; i < 5; i++) {
  setTimeout((function(i) {
    console.log(i);
  })(i), i * 1000);
}

答案： 0 1 2 3 4

第六击

运行机制

setTimeout(function() {
  console.log(1)
}, 0);
new Promise(function executor(resolve) {
  console.log(2);
  for( var i=0 ; i<10000 ; i++ ) {
    i == 9999 && resolve();
  }
  console.log(3);
}).then(function() {
  console.log(4);
});
console.log(5);