×

Web前端TIPS:循环中的闭包

作者:Terry2019.08.05来源:Web前端之家浏览:7562评论:0

Web前端TIPS:循环中的闭包,大家来了解下吧。

如果你碰到过这种情况:

JavaScript 代码:

var funcs = [];
for (var i = 0; i < 3; i++) {
  funcs[i] = function() {
    console.log("i value is" + i);
  };
}
funcs[0]();
funcs[1]();
funcs[2]();

你预期的输出是:

JavaScript 代码:

i value is 0
i value is 1
i value is 2

而实际的输出却是:

JavaScript 代码:

i value is 3
i value is 3
i value is 3

原因是闭包的捕获机制 以及 i 在内部进行表示。要解决这个问题,你可以这么做:

JavaScript 代码:

var funcs = [];
for (var i = 0; i < 3; i++) {
  funcs[i] = (function(value) {
    console.log("i value is " + i);
  })(i);
}

上述代码有效地复制 i 的值将其传递给闭包。或者你可以这么做:

JavaScript 代码:

for (let i = 0; i < 3; i++) {
  console.log("i value is " + i);
}

在这里,let 将变量作用域限制在 for 循环中,并在每次迭代中生成一个新的值,因此,我将按照预期的那样在闭包中绑定不同的值。

您的支持是我们创作的动力!
温馨提示:本文作者系Terry ,经Web前端之家编辑修改或补充,转载请注明出处和本文链接:
https://www.jiangweishan.com/article/js8029834092834.html

网友评论文明上网理性发言 已有0人参与

发表评论: