JavaScript中forEach与each

浅谈JavaScript中forEach与each

forEach是ES5中操作数组的一种方法，主要功能是遍历数组，例如：

var arr = [1,2,3,4];
arr.forEach(alert);

等价于：

var arr = [1, 2, 3, 4];
for (var k = 0, length = arr.length; k < length; k++) {
 alert(array[k]);
}

forEach方法中的function回调有三个参数：第一个参数是遍历的数组内容，第二个参数是对应的数组索引，第三个参数是数组本身

因此：

　　[].forEach(function(value,index,array){
　　　　//code something
　　});

等价于：

　　$.each([],function(index,value,array){

　　　　//code something

　　})

写一个例子；

var arr = [1,2,3,4];
arr.forEach(function(value,index,array){
    array[index] == value;    //结果为true
    sum+=value;  
    });
console.log(sum);    //结果为 8

map：map即是 “映射”的意思 用法与 forEach 相似，用法即：

[].map(function(value,index,array){

　　//code

})

另一个例子

当你有一个如下数组时：

var users = [
    {
        lastName: 'Li',
        firstName: 'Lei'
    },
    {
        lastName: 'Han',
        firstName: 'Meimei'
    }
];

现在我希望你处理这个数组，给其中每一个对象加一个fullName字段，就把lastName和firstName拼一起就行(简单吧)。

当你用相对原始的语法处理时，可能是这样的：

for(var i = 0; i < users.length; i++){
    var user = users[i];
    user.fullName = user.lastName + user.firstName;
}

代码是对的，但却不好(优秀)，为什么？原因有2

• 创建了与主业务无关的for loop
• 创建了与主业务无关的变量i

用forEach的好处是什么？答案就是解决了上面那2个缺陷，代码如下：

users.forEach(function(user, index, arr){
    user.fullName = user.lastName + user.firstName;
});

这里，你只需要关注主业务(fullName的生成)，无需关注遍历的过程及方法。