比如在微信小程序中要遍历输出 0-9 的数,我们会使用for循环
for (var i = 0; i < 10; i++) {
console.log(i);
}
输出:
但是,如果我在循环时同时调用wx的api接口10次,那么输出的结果就会不同(这是产生了闭关的效应)
for (var i = 0; i < 10; i++) {
wx.showToast({
title: 'haha',
success: function () {
console.log(i);
}
})
}
输出:
可以看到输出了10次10,这是因为i自变量的作用域范围,在这里它相当于全局变量。
可以理解为一个存储单元与与分配的所以下属存储单元都相通(自己的理解)
解决方法:
1、使用临时函数(兼容所有)
for (var i = 0; i < 10; i++) {
(function (j) {
wx.showToast({
title: 'haha',
success: function () {
console.log(j);
}
})
})(i);
}
等同于
for (var i = 0; i < 10; i++) {
function temp(j) {
wx.showToast({
title: 'haha',
success: function () {
console.log(j);
}
})
};
temp(i);
}
输出:
2、使用ES6中let的块作用域(推荐)(低版本IE不兼容)
for (let i = 0; i < 10; i++) {
wx.showToast({
title: 'haha',
success: function () {
console.log(i);
}
})
}
输出:
但是如果将let i定义在函数外部,则对于循环来说还是相当于全局变量
let i;
for (i = 0; i < 10; i++) {
wx.showToast({
title: 'haha',
success: function () {
console.log(i);
}
})
}
结果还是: