ES6关于数组操作forEach,map,filter,find,some,every,reduce学习理解和使用
首先说明:数组操作forEach(),map(),filter(),find(),some(),every(),reduce()所有方法,只要是return回来的,均不改变原数组。
forEach()
参数item, index
遍历数组全部元素使用,相当于用for循环吧
var arr = [1,2,3,4,5,] ;
arr.forEach(function(item,index){
console.log(item);
});
/*
1
2
3
4
5
*/
map ()
一项一项更新数组内容,有return的话,返回一个新数组
var arr = [1,2,3,4,5] ;
arr.map((item,index)=>{ return item*2})
// [2, 4, 6, 8, 10]
filter()和find()的区别
filter,find 一般都用于筛选数组,filter返回一个新数组,find则返回第一个符合return后判断内容的单个item
var arr = [1,2,3,4,5] ;
arr.filter(item=>item>2)
// (3) [3, 4, 5]
arr.find(item=>item>2)
// 3
includes()
判断数组是否包含一项内容
var arr = [1,2,3,4,5] ;
arr.includes(4)
// true
arr.includes(6)
// false
some()和every()的区别
some(), every()都是用来判断用的,只会返回true和false
其中some()只有一项满足就会返回true, every()只有一项不满足就会返回false
var arr = [1,2,3,4,5] ;
arr.some(item=>item>4)
// true
arr.some(item=>item>6)
// false
arr.every(item=>item>4)
// false
arr.every(item=>item>0)
// true
reduce()
reduce()一般用于计算,合并,叠加等等
//求和计算
var arr1 = [1,2,3,4,5] ;
var new1 = arr1.reduce(function(sum,next,index){
return sum+next ;
/*
*第一次:pre-->1 next-->2 index-->1
*遍历计算return得结果为pre+next=1+2=3
*第二次:pre-->3 next-->3 index-->2
*遍历计算return得结果为pre+next=3+3=6
*第三次:pre-->6 next-->4 index-->3
*遍历计算return得结果为pre+next=6+4=10
*第四次:pre-->10 next-->5 index-->4
*遍历计算return得结果为pre+next=10+5=15
*/
})
//扁平化数组
var arr2 = [[1,2,3],[4,5],[6,7]] ;
var new2 = arr2.reduce(function(pre,next,index){
return pre.concat(next); //前数组拼接后数组 .concat()
})
//对象数组叠加计算
var arr3 = [{price:10,count:1},{price:15,count:2},{price:10,count:3}];
var new3 = arr3.reduce(function(pre,next,index){
return pre+next.price*next.count;
//当需要对第一项进行操作时,后面pre使用上一项操作结果,不再需要操作
//所以当需要操作第一项的时候,利用reduce(callbreak(){},往数组第一项前添加一项,如:0)
},0) //在原数组第一项添加为0,不改变原数组,则可不操作第一项
console.log(new1);
console.log(new2);
console.log(new3);
// 15
// [1, 2, 3, 4, 5, 6, 7]
// 70
Leave a Reply