1、Array.map()
此方法是将数组中的每个元素调用一个提供的函数,结果作为一个新的数组返回,并没有改原来的数组
//有三个参数
第一个是遍历的数组内容
第二个是参数是对应的数组索引
第三个参数是数组本身
let arr = [1, 2, 3, 4, 5]
let newArr = arr.map(x => x*2)
//arr= [1, 2, 3, 4, 5] 原数组保持不变
//newArr = [2, 4, 6, 8, 10] 返回新数组
2. Array.forEach()
此方法是将数组中的每个元素执行传进提供的函数,没有返回值,注意和map方法区分
//有三个参数
第一个是遍历的数组内容
第二个是参数是对应的数组索引
第三个参数是数组本身地
let arr = [1, 2, 3, 4, 5]
arr.forEach(function(value,index,arr){
console.log(value+1)
)
// arr = [1, 2, 3, 4, 5] 数组未改变,注意和map区分
3.Array.filter()
次方法是对数组中所有元素进行判断,将满足条件的元素作为一个新的数组返回
同理有三个参数
let arr = [1,2,3,4,5]
let newArr = arr.filter(x=>x>2)
//newArr [3,4,5]
4.Array.every()
此方法是对数组中所有元素进行判断返回一个布尔值,如果所有元素都满足判断条件,则返回true,否则为false,不改变原来数组
同理有三个参数
let arr = [1,2,3,4]
arr.every(x=>x>=1) // true
arr.every(x=>x>2) // false
5.Array.some()
次方法是判断数组中是否有满足条件的选项,只要一项满足条件就返回true 否则返回false 不改变原来数组
同理有三个参数
let arr = [1,2,3,4]
arr.some(x=>x>1) //true
arr.some(x=>x>5) // false
6.Array.reduce()
次方法是数组中每一个元素一次执行回调函数,不包括数组中被删除或者未被赋值的元素
有四个参数
1、previousValue (上一次调用回调返回的值,或者是提供的初始值(initialValue))
2、currentValue (数组中当前被处理的元素)
3、index (当前元素在数组中的索引)
4、array (调用 reduce 的数组)
arr.reduce(callback,[initialValue])
例1
let arr = [1, 2, 3, 4];
let sum = arr.reduce(function(prev, cur, index, arr) {
console.log(prev, cur, index);
return prev + cur;
})
console.log(arr, sum);
打印结果:
1 2 1
3 3 2
6 4 3
[1, 2, 3, 4] 10
这里可以看出,上面的例子index是从1开始的,第一次的prev的值是数组的第一个值。数组长度是4,但是reduce函数循环3次。
例2
var arr = [1, 2, 3, 4];
var sum = arr.reduce(function(prev, cur, index, arr) {
console.log(prev, cur, index);
return prev + cur;
},0) //注意这里设置了初始值
console.log(arr, sum);
打印结果:
0 1 0
1 2 1
3 3 2
6 4 3
[1, 2, 3, 4] 10
这个例子index是从0开始的,第一次的prev的值是我们设置的初始值0,数组长度是4,reduce函数循环4次。
结论:如果没有提供initialValue,reduce 会从索引1的地方开始执行 callback 方法,跳过第一个索引。如果提供initialValue,从索引0开始。
注意:如果这个数组为空,运用reduce是什么情况?
var arr = [];
var sum = arr.reduce(function(prev, cur, index, arr) {
console.log(prev, cur, index); return prev + cur;})
//报错,"TypeError: Reduce of empty array with no initial value"
但是要是我们设置了初始值就不会报错,如下:
var arr = [];
var sum = arr.reduce(function(prev, cur, index, arr) {
console.log(prev, cur, index); return prev + cur;},0)
console.log(arr, sum); // [] 0
所以一般来说我们提供初始值通常更安全
//reduce 高级用法
1 计算数组中每个元素出现的次数
let names = ['aa','bb','cc','dd','aa','dd']
let NewName = names.reduce(function(pre,cut){
if(cut in pre){
pre[cut]++
}else{
pre[cut] = 1
} return pre },{})
console.log(NewName) //['aa':2,'bb':1,'cc':1,'dd':2]
2 数组去重
let arr = [1,2,3,4,3,2,1,5,4,6]
let newArr = arr.reduce(function(pre,cut){
if(!pre.includes(cut)){
return pre.concat(cut)
}else{
return pre
} },[])
console.log(newArr)
3将二维数组转化为一维数组
let arr = [1,2,3,4,3,2,1,5,4,6]
let newArr = arr.reduce(function(pre,cut){
if(!pre.includes(cut)){
return pre.concat(cut)
}else{ return pre
}
},[])
console.log(arr.includes(2,3))
4将二维数组转化为一维数组
let arr = [[1,2,3],[2,3,4],[5,6]]
let newArr = arr.reduce(function(pre,cut){
return pre.concat(cut)
},[])
console.log(newArr)
4将多维数组转化为一维数组
let arr = [[0, 1], [2, 3], [4,[5,6,7]],55]
const fnc = function(arr){
return arr.reduce(function(pre,cut){
return pre.concat(Array.isArray(cut)?fnc(cut):cut)
},[]) }
let newArr = fnc(arr)
console.log(newArr)
5对象属性求和
let result = [
{ subject:'math', score:90 }, { subject:'chinese', score:80 }, { subject:'english', score:80 }
]
const sum = result.reduce((pre,cut)=>pre+cut.score,0)
console.log(sum)
7 sort()
数组排序 默认升序 按照字母编码排序
有一个参数为函数
let array = [1,3,4,5,32,345,6]
console.log(array.sort()) //[1, 3, 32, 345, 4, 5, 6]
console.log(array.sort((pre,cut)=>pre>cut?1:-1)) // [1, 3, 4, 5, 6, 32, 345]