js中数组的map与forEach方法

关于js中数组的遍历的两种方法:forEach与map

一、forEach遍历

1)arr.forEach(function(数组中的元素,每个元素对应得下标,数组自身){})
            arr.forEach(function(item,index,arr){
            console.log(item,index,arr);
        })
2)forEach求数组元素之和
        var arr=[1,3,4,3,5,2,3,5,7,4,3];
        var sum=0
        arr.forEach(function(item,index,arr){
            sum+=item;
        })
        console.log(sum);//40
3)使用forEach可以跳过空元素
        var arr=[1,3,4,3,5,,3,5,7,4,3];
        var sum=0
        arr.forEach(function(item,index,arr){
            console.log(item,index);
        })
4)复制不带空元素的数组
        var arr=[1,3,4,3,5,,3,5,7,4,3];
        var arr1=[];
        arr.forEach(function(item,index,arr){
            arr1.push(item);
        })
        console.log(arr1);

二、map遍历

1)map会返回一个与原数组长度相等的新数组,arr.forEach(function(数组中的元素,每个元素对应得下标,数组自身){})
        var arr=[1,3,4,3,5,7,3,5,7,4,3];
        var arr1=arr.map(function(item,index,arr){
            // console.log(item,index,arr);
            //在map中使用return就是在对应得下标中添加对应的数据
            return item+"a";
        });
        console.log(arr1);
2)map循环遍历,返回的数组长度与原数组一致
        var arr=[1,3,4,3,5,7,3,5,7,4,3];
        var arr1=arr.map(function(item,index,arr){
            if(item>4)
            return item
        })
        console.log(arr1);//[undefined, undefined, undefined, undefined, 5, 7, undefined, 5, 7, undefined, undefined]
3)map也不遍历空元素

三、forEach与map的区别

1)forEach没有返回值,map返回一个与原数组等长的新数组
----------------------案例-----------------------
            var arr=[
            {id:1001,name:"电视",price:4500},
            {id:1002,name:"电脑",price:6500},
            {id:1003,name:"冰箱",price:2000},
            {id:1004,name:"洗衣机",price:1000},
            {id:1005,name:"手机",price:5500}
        ];
//forEach方法
        arr.forEach(function(item,index,arr){
            // 给对象添加num属性,属性值随机从1到9
            item.num=parseInt(Math.random()*9+1);
            // 给对象添加total属性值
            item.total=item.price*item.num;
        })
        console.log(arr);
//map方法
        var arr1=arr.map(function(item,index,arr){
            item.num=parseInt(Math.random()*9+1);
            item.total=item.price*item.num;
            return item;
        })
        console.log(arr1);

 

posted @ 2020-03-29 19:53  she_will  阅读(1112)  评论(0编辑  收藏  举报