JavaScript - setTimeout() / clearTimeout()

Question

JavaScript - setTimeout() / clearTimeout()

3

为什么此函数打印出的是 0 1 2 而不是 0 1 2 3？

(function fn1(){
    for (var i = 0; i < 4; i++) {
        var tc=setTimeout(function(i){
            console.log(i);
            clearTimeout(tc);
        }, 10, i);
    }
})();

- Ekil

你为什么要清除超时？ - smnbbrv

这是面试中问到的一个问题。 - Ekil

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- CertainPerformance · Accepted Answer

var被提升了，所以在for循环中，tc会被多次（同步地）重新赋值，并最终成为最后一个setTimeout。因此，每次超时函数运行时，它引用相同的tc，该tc引用最终迭代的超时并使用clearTimeout将其清除。对解释器来说，它看起来像这样：

(function fn1() {
  var tc;
  var i;
  for (i = 0; i < 4; i++) {
    tc = setTimeout(function(i) {
      console.log(i);
      clearTimeout(tc);
    }, 10, i);
  }
})();

如果你想要打印出 0 1 2 3，请使用let（let 具有块级作用域，并且不会被提升）来为每个迭代创建一个独立的 tc 绑定：

(function fn1() {
  for (let i = 0; i < 4; i++) {
    let tc = setTimeout(function(i) {
      console.log(i);
      clearTimeout(tc);
    }, 10, i);
  }
})();