https://www.cnblogs.com/shewill/p/12594337.html
1、map():是指“映射”。[].map();
不改变原数组,基本用法跟forEach
方法类似:
array.map(callback,[ thisObject]);
callback
的参数也类似:
[].map(function(value, index, array) {
// ...
});
map
方法的作用不难理解,“映射”嘛,也就是原数组被“映射”成对应新数组。下面这个例子是数值项求平方:
var data = [1, 2, 3, 4];
var arrayOfSquares = data.map(function (item) {
return item * item;
});
alert(arrayOfSquares); // 1, 4, 9, 16
callback
需要有return
值,如果没有,就像下面这样:
var data = [1, 2, 3, 4];
var arrayOfSquares = data.map(function() {});
arrayOfSquares.forEach(console.log);
结果如下图,可以看到,数组所有项都被映射成了undefined
:
在实际应用场景中,在便利出的数据需要处理的时候用到map比较多一些,例如商品列表数据回来之后进行展示需要进行另外的操作时,如此不会改变原数组,便可实现效果
map()方法是不会改变原来的数组,也就是例子中的arr,数据处理之后会返回一个新的数组result,这两者之间没有指向关系
举个例子:
let arr = [1,2,3];
let arrQ = arr.map(item => item * item);
// arr = [1,2,3];
// arrQ = [1,4,9]; // map 不修改原数组,需要用一个新数组去接收 数据处理后返回的新数组
2、forEach():改变原数组
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);