转化一个数字数组为function数组(每一个function都弹出相应的数字)

汤姆大叔的博客里看到了6个基础题目:本篇是第2题 - 转化一个数字数组为function数组(每一个function都弹出相应的数字)javascript

此题关键点:html

一、如何将一个匿名函数存入数组?java

二、如何锁住须要调用的值?数组

 

解点1:如何将一个匿名函数存入数组?

var arr = [];
arr[0] = function() { alert('ok'); }

如上,arr[0]即为一个函数,可用arr[0]()进行调用。下面是初步实现的代码:闭包

var arr = [9,8,7,6];
function toFunctionArray(arr) {
    for(var i=0; i<arr.length; i++) {
        var v = arr[i];
        arr[i] = function() {
            alert( v );
        };
    }
}
toFunctionArray(arr);
for(var i=0; i<arr.length; i++) {
    arr[i]();
}

以上代码,看起来没毛病,可是运行就会发现弹出4次 6。为什么会如此?请继续看解点2函数

 

解点2:如何锁住须要调用的值?

在toFunctionArray函数中的for循环会执行4次,循环结束后,v的值是6(第4个元素的值),即转换后的数组中的每个元素老是alert了同一个v。如何让每一个函数调用不一样的v呢?解决这个问题的办法就是把v的值传递给匿名函数,代码以下:spa

var arr = [9,8,7,6];
function toFunctionArray(arr) {
    for(var i=0; i<arr.length; i++) {
        var v = arr[i];
        arr[i] = function(v) {
            alert( v ); //每一个v都保存了不一样的值
        }(v); //注意此处的v做为匿名函数的参数
    }
}
toFunctionArray(arr);
for(var i=0; i<arr.length; i++) {
    arr[i]();
}

若是此处不太明白,请了解javascript变量的做用域、js内存回收机制、闭包等概念。code

 

-------------------------------------------- 解题完毕的分割线 -------------------------------------------htm

 

此外,可用数组的forEach来实现,会变得比较直观,代码以下:blog

var arr = [9,8,7,6];
function toFunctionArray(arr) {
    arr.forEach( function(v, i, arr) {
        arr[i] = function() {
            alert( v );
        }
    } );
}
toFunctionArray(arr);
arr.forEach( function(v, i, arr) {
    arr[i]();
} );

关于此法,再也不详解,此题结束!

相关文章
相关标签/搜索