ES5 Array实例对象新增方法forEach,map,filter,find,some,every详解

在es5里面，它们分别是foreach、map、filter、some、every。

 

1，forEach

forEach类似于普通的for循环，只是单纯的遍历数组元素，不会改变原数组也不会生成新的数组。

let arr=[1,3,5,false,true];
arr.forEach((val,index,arrs)=>{
  console.log(val,index,arrs);
});

优点：写法更加简洁

缺点：缺点是不能使用break退出循环或者使用continue结束当前循环继续新迭代

2，map

主要作用做数据映射，不会改变原数组，会生成新的数组

 

let arr=[{name:'zhang',age:21},{name:'li',age:25},{name:'wang',age:45}];
let narr=arr.map((val,index,arrs)=>{
  var obj={};
  obj.n=val.name;
  obj.a=val.age;
  return obj
});
console.log(narr);//[{"n":"zhang","a":21},{"n":"li","a":25},{"n":"wang","a":45}]

 

通过实例可以发现，使用数组实例的map函数，在实际工作当中，对于后台返回的数据字段要进行修改时，非常有用。

 

 3，filter

筛选符合条件的数据，不会修改原数组，返回新的数组。

let phone = ['荣耀','vivo','三星','华为','锤子','苹果','小米','锤子']
let result = phone.filter((el,index,arr) => {
　　return arr.indexOf(el) == index
})
console.log(result)//["荣耀", "vivo", "三星", "华为", "锤子", "苹果", "小米"]

 

巧妙的使用可以进行数组去重

 

 

 4，find

筛选数组中第一个符合条件的数据

 

let arr=[{name:'zhang',age:21},{name:'li',age:25},{name:'wang',age:45}];
let data=arr.find((val,index,arrs)=>{
  return val.age>23
});
console.log(data);//{"name":"li","age":25}

 

 

5，some

有任何数据满足条件就返回true，所有数据都不满足条件则返回false

 

有数据符合条件

let arr=[{name:'zhang',age:21},{name:'li',age:25},{name:'wang',age:45}];
let flag=arr.some((val,index,arrs)=>{
  return val.name=='zhang'
});
console.log(flag);//true

 

所有数据都不符合条件

let arr=[{name:'zhang',age:21},{name:'li',age:25},{name:'wang',age:45}];
let flag=arr.some((val,index,arrs)=>{
  return val.name=='yu'
});
console.log(flag);//false

 对比发现只要有数据满足条件就返回true，否则返回false

 

 *every与some相对应【所有数据都满足条件返回true，否则返回false】