下面这个例子说明外部环境中的局部变量没有被释放
var fnArr = [];
for (var i = 0; i < 10; i ++) {
fnArr[i] = function(){
return i;
};
console.log(i)
}
console.log( fnArr[3]() ); //
console.log( fnArr3 ); 不能输出3的关键原因,fnArr3执行了一次内部嵌套函数,这个时候外部循环已经循环完了 i===10
修改函数,使fnArr0 输出0、fnArr1 输出1、fnArr2 输出2。。。
怎么办呢?
想到每次的i值都需要执行一次内部嵌套函数,一遇到i值就执行一次「立即执行」所以把内部嵌套函数修改成立即执行函数,OK了
//方法一:
var fnArr = [];
for (var i = 0; i < 10; i ++) {
(function(n){
fnArr[n] = function(){
return n;
};
})(i);
}
console.log( fnArr[3]() ); //3
//方法二:
var fnArr=[];
for (var i = 0; i < 10; i ++) {
fnArr[i] = function(){
var n=i
return function(){
return n;
}
}();
}
console.log( fnArr[3]() );
//方法三:
var fnArr=[];
for (var i = 0; i < 10; i ++) {
fnArr[i] = function(i){
return function(){
return i;
}
}(i);
}
console.log( fnArr[3]() );
//方法四:
var fnArr = [];
for (let i = 0; i < 10; i ++) { //使用ES6: let
fnArr[i] = function(){
return i;
};
}
console.log( fnArr[3]() );
易错修改
修改成:
<script>
var fnArr=[];
for (var i = 0; i < 10; i ++) {
fnArr[i] = function(i){
return i;
}(i);
}
console.log( fnArr[3]);
</script>
输出结果: