整理js数组方法以及高阶函数

1.数组填充 fill()

语法：array.fill(value, start, end)

value	必填：填充的值
start	选填：开始的位置
end	选填：结束位置

arr = [1,2,3,4,5];
arr.fill(0);
//[0, 0, 0, 0, 0]
arr.fill(1,1);
//(5) [0, 1, 1, 1, 1]
arr.fill(2,2,3);
//[0, 1, 2, 1, 1]
arr = new Array(5).fill(0);
//[0, 0, 0, 0, 0]

2.数组合并 concat()

语法：array.concat(arr1,arr2,…)

参数选填，不填参数则进行数组复制操作

arr1 = [1,2,3]
arr2 = [3,4,6]
arr3 = arr1.concat(arr2);//[1, 2, 3, 3, 4, 6]
arr1 = [1,2,3]
arr2 = [3,4,6]
arr3 = [];
arr3 = arr3.concat(arr1, arr2);//[1, 2, 3, 3, 4, 6]  

在es6中，还可以使用拓展运算符进行数组合并

arr1 = [1,2,3]
arr2 = [3,4,6]
arr3 = [...arr1, ...arr2]//[1, 2, 3, 3, 4, 6]

3.from()

Array.from可以将两类对象转为真正的数组：拥有 length 属性的对象或可迭代的对象

语法：Array.from(object, mapFunction, thisValue)

object	必需，要转换为数组的对象。
mapFunction	对每个元素的操作
thisValue	可选，映射函数(mapFunction)中的 this 对象。

temp = {
	'0': 1,
	'1': 2,
	'2': 3,
	length: 3,
}
arr = Array.from(temp);//[1, 2, 3]
arr = Array.from(temp, item=>item*10);//[10, 20, 30]
arr = Array.from('hello');//["h", "e", "l", "l", "o"]

如果参数是一个数组，那么Array.from会返回一个一模一样的新数组。

arr = Array.from([1,2,3]);//[1, 2, 3]

4.entries(),keys(),values()

entries() 方法返回一个数组的迭代对象，该对象包含数组的键值对 (key/value)。可用于for of操作。
entries()是对键值对的遍历、keys()是对键名的遍历、values()是对键值的遍历。

arr = [1,2,3]
for(let key of arr.keys()){
	console.log(key)// 0 1 2
}
for(let value of arr.values()){
	console.log(key)// 1 2 3
}
for(let (key,value) of arr.entries()){
	console.log(key, value)// [0,1]  [1,2]  [2,3]
}

还可以用手动调用next()的方式实现遍历

arr = [1,2,3]
a = arr.entries();
a.next().value;// [0, 1]
a.next().value;// [1, 2]
a.next().value;// [2, 3]

5.join()

将数组元素转换为一个字符串
语法：array.join(separator)

指定要使用的分隔符。默认使用逗号作为分隔符。

arr = [1,2,3]
arr.join()//"1,2,3"
arr.join('')//"123"

6.数组的添加删除

• pop() 删除最后一个元素,影响原数组

arr = [1,2,3]
arr.pop()//返回删除的值，3
arr//[1,2]

• push() 在最后添加一个或者多个元素,影响原数组

arr = [1,2,3]
arr.push(4)//返回新的长度，4
arr//[1,2,3,4]
arr.push(5,6)
arr//[1,2,3,4,5,6]
arr.push([7])
arr//[1,2,3,4,5,6,[7]]

• shift() 删除第一个元素,影响原数组

arr = [1,2,3]
arr.shift()//返回删除的值，1
arr//[2,3]

• unshift() 在最前添加一个或者多个元素,影响原数组

arr = [2,3]
arr.unshift(1,2)//返回新的长度，4
arr//[1,2,2,3]

• slice(start, end) 截取数组的一部分,不影响原数组

start	截取开始的位置，包括 ，为负数时 -1对应最后一个元素
end	截取结束的位置，不包括，默认到数组结束

arr = [1,2,3,4,5]
arr.slice(1,3)//[2,3]
arr//[1,2,3,4,5]
arr.slice(-2)//[4,5]
arr//[1,2,3,4,5]

• splice(start, num, item1,item2,…) 删除或者替换区域内元素,影响原数组

start	开始的位置
num	删除的个数，默认到数组结束
item	新增的元素

arr = [1,2,3,4,5]
arr.splice(1,2)//[2,3]
arr//[1,4,5]

arr = [1,2,3,4,5]
arr.splice(1,2,'item1', 'item2', 'item3')//[2,3]
arr//[1, "item1", "item2", "item3", 4, 5]

7.map()

对数组中每个元素进行处理，然后返回一个新的数组，不影响原数组。
需要注意的是，map不会对空数组进行检测

语法：array.map(function(currentValue,index,arr), thisValue)

currentValue	当前值
index	当前索引
arr	原数组
thisValue	this的指向，默认为全局对象

arr = [1,2,3]
arr.map(item=>item*10)//[10, 20, 30]
//上面的写法等价于
arr.map(function(item){
	return item*10
})//[10, 20, 30]

arr//[1,2,3]

8.reduce()，reduceRight()

从数组开始操作到数组结束。返回一个值，不影响原数组
语法：array.reduce(function(total,currentValue,index,arr), initialValue)

total	初始值或计算之后返回的值
currentValue	当前值
index	当前索引
arr	原数组
initialValue	传递给函数初始值的值

reduce()是从左往右计算，reduceRight()是从右往左计算。

arr = [1,2,3]
arr.reduce((x,y)=>x+y)//6

reduce()会把结果继续和下一个元素做累积计算。上一次运算的x+y会放在x中进行下一次运算，直至结束。
reduce()不会对空数组进行操作

arr = []
a = arr.reduce((x,y)=>x+y)//error: Reduce of empty array with no initial value

9.filter()

对内容进行过滤。不影响原数组

语法：array.filter(function(currentValue,index,arr), thisValue)

currentValue	当前值
index	当前索引
arr	原数组
thisValue	this的指向，默认为全局对象

arr = [1,2,3,4,5];
//获取所有奇数，关于逻辑与或的知识请自行百度
arr.filter(item=>item&1)//[1,3,5]

arr = ['hello','world','good','nice','csdn'];
arr.filter(item=>item.length>4)//["hello", "world"]

10.every()

所有元素为真则为真。不影响原数组
语法：array.every(function(currentValue,index,arr), thisValue)

currentValue	当前值
index	当前索引
arr	原数组
thisValue	this的指向，默认为全局对象

arr = [1,2,3,4,5];
arr.every(item=>item>1)//false
arr.every(item=>item<6)//true

11.some()

有一个元素为真则为真，所有为假则为假。不影响原数组

语法：array.some(function(currentValue,index,arr), thisValue)

currentValue	当前值
index	当前索引
arr	原数组
thisValue	this的指向，默认为全局对象

arr = [1,2,3,4,5];
arr.some(item=>item>4)//true
arr.some(item=>item<1)//false

12.sort()

对数组进行排序处理。默认根据ASCII码进行排序。如果带参数，参数必须为函数。影响原数组

arr = [10, 1, 20, 2];
arr.sort();//[1, 10, 2, 20]
//sort()方法默认把所有元素先转换为String再排序，
//因为字符'1'比字符'2'的ASCII码小,所以'10'排在了'2'的前面

arr.sort((x, y )=>{return x>y?1:-1});//[1, 2, 10, 20]

arr = ['array','Array', 'sort', 'Sort'];
arr.sort()//["Array", "Sort", "array", "sort"]
//大写的英文字符的ASCLL码小于小写的英文字符的ASCLL码

arr.sort((x, y )=>{
	x = x.toUpperCase();
	y = y.toUpperCase();
	return x>y?1:-1
});
//["Array", "array", "Sort", "sort"]

13.find(), findIndex(), indexOf(), lastIndexOf()

• find(function(currentValue, index, arr),thisValue)

返回查询的第一个元素（之后的元素将不会再调用函数）、不会对空数组进行操作、如果没有符合条件的返回undefined、不影响原数组

currentValue	当前值
index	当前索引
arr	原数组
thisValue	this的指向，默认为全局对象

arr = [1,2,3,4]
arr.find(item=>item===2)//2
arr.find(item=>item===5)//undefined

• findIndex(function(currentValue, index, arr),thisValue)

返回查询的第一个元素的索引（之后的元素将不会再调用函数）、不会对空数组进行操作、如果没有符合条件的返回-1、不影响原数组

currentValue	当前值
index	当前索引
arr	原数组
thisValue	this的指向，默认为全局对象

arr = [1,2,3,4]
arr.findIndex(item=>item===2)//1
arr.findIndex(item=>item===5)//-1

• indexOf(item, start)

返回 item 的第一次出现的位置，没有则返回-1。

item	查找的元素
start	开始检索的位置，有效值0至length-1，默认从开始到结束

arr = [1,2,2,3,4]
arr.indexOf(2)//1,只返回第一次出现的下标
arr.indexOf(2, 3)//-1,从3下标开始检索，没有元素2，所以返回-1

• lastIndexOf(item, start)

返回 item 的最后一次出现的位置（即从后往前的第一个），没有则返回-1。与indexOf()的区别仅仅在于方向不同。

item	查找的元素
start	开始检索的位置，有效值0至length-1，默认从最后一个元素开始

arr = [1,2,2,3,4]
arr.lastIndexOf(2)//2 ,只返回第一次出现的下标（从后往前的第一个）
arr.lastIndexOf(2, 1)//1,从1下标开始向前检索
arr.lastIndexOf(2, 0)//-1,从0下标开始向前检索

14.forEach()

语法：forEach(function(currentValue, index, arr),thisValue)

遍历数组、不会对空数组进行操作.

currentValue	当前值
index	当前索引
arr	原数组
thisValue	this的指向，默认为全局对象

arr = [1,2,3,4]
sum = 0
arr.forEach(item=>sum+=item)
sum//10