2021年接近尾声，为这一年的前端工作做一个小总结~数组在前端的工作中常常用到，但是数组的方法又非常多，很多同学还不知道数组的方法怎么使用。所以在这里用我毕生所学❀，给大家总结一下数组的常用方法！！
一、改变原始数组
1、 Array.pop()
删除数组的最后一个元素，返回值是被删除的元素
let arr = [1, 2, 3]
let newArr = arr.pop()
console.log(arr); //[ 1, 2 ]
console.log(newArr); //3
2、Array.shift（）
删除数组的第一个元素，返回值是被删除的元素
let arr = [1, 2, 3]
let newArr = arr.shift()
console.log(arr); //[ 2, 3 ]
console.log(newArr); //1
shift和pop方法都不需要传参数，并且一次操作，只能删除一个元素。
3、Array.push（）
数组结尾处添加一个或多个新元素，返回值是新数组的长度
let arr = ['hello']
let newArr = arr.push('world', '!!' )
console.log(arr); //[ 'hello', 'world' '!!' ]
console.log(newArr); 3
4、Array.unshift ()
数组开头处添加一个或多个新元素，返回新数组长度
let arr = ['world', '!!']
let newArr = arr.unshift('hello')
console.log(arr); //[ 'hello', 'world', '!!' ]
console.log(newArr); 3
5、Array.splice（）
Array.splice(index,length,item1,...itemX) 添加或删除数组中的元素
| 参数 | 描述 |
|---|---|
| index | 必写， 起始位置的索引号，必须是数字。 |
| length | 可选。规定应该删除多少元素。必须是数字，但可以是 "0" |
| item1,....itemX | 可选。要添加到数组的新元素 |
添加，删除长度为0，即为添加。没有返回值
let fruits = ["Banana", "Orange"];
let frs = fruits.splice(2, 0, "Lemon");
console.log(fruits); //[ 'Banana', 'Orange', 'Lemon']
console.log(frs);//[]
替换，该索引下标已存在元素，又要在此索引下标添加元素，即为替换。返回值是被替换的元素
let fruits = ["Banana", "Orange"];
let frs = fruits.splice(1, 1, "Lemon");
console.log(fruits); //[ 'Banana', 'Lemon']
console.log(frs);//[ 'Orange']
删除，返回值是被删除的元素
let fruits = ["Banana", "Orange"];
let frs = fruits.splice(1, 1);
console.log(fruits); //[ 'Banana']
console.log(frs);//[ 'Orange' ]
6、Array.sort()
对数组进行排序。
英文字母，按英文字母的顺序排序；
let letter = ['a', 'c', 'f', 'd', 'b', 'e']
letter.sort()
console.log(letter);//[ 'a', 'b', 'c', 'd', 'e', 'f' ]
中文，按utf-16进行排序。
数字排序，可以用a-b的方法进行升序排序，用b-a的方法进行降序排序
let arr = [4,10, 5, 7];
arr.sort((a,b)=>{
return a-b
});
console.log(arr); //[4,5,7,10]
let arr = [4,10, 5, 7];
arr.sort((a,b)=>{
return b-a
});
console.log(arr); //[10,7,5,4]
7、Array.reverse ()
反转数组中的元素排序。
常用：将数组进行sort（）方法排序后，再进行reverse（）反转。
let letter = ['a', 'b', 'c', 'd']
letter.reverse()
console.log(letter);['d', 'c', 'b', 'a']
二、不会改变原数组
1、Array.toString（）
将数组转化为字符串
let arr = ['hello', 'world']
let newArr = arr.toString()
console.log(arr); //[ 'hello', 'world' ]
console.log(newArr); //hello,world
2、Array.forEach（）
遍历数组
arr.forEach(callback(currentValue [, index [, array]])[, thisArg])
对于空数组是不会执行回调函数的。 最常用的方法，传入item--获取数组中所有元素，传入index--获取数组的元素对应的索引。（item（value）和index可以自取名字，在代码语义化中，很多前端工程师都默认用这几个单词，取元素和索引。）
| 参数 | 描述 |
|---|---|
| currentValue | 必须，数组中正在处理的当前元素。 |
| index | 可选，当前元素的索引值 |
| array | :可选，当前元素所属的数组对象 |
| thisArg | 可选，当执行回调函数 callback时，用作 this的值。 |
const array = ['a', 'b', 'c'];
array.forEach((item, index) => {
console.log(item)
console.log(index)
})
//按顺序输出：a 0 b 1 c 2
3、Array.map（）
返回一个新数组， 函数的作用是对数组中的每一个元素进行处理，返回新的元素。
不对空数组进行检测，跟forEach一样。如果不return，newArr的返回值为undefined
arr.map(function callback(currentValue[, index[, array]]{})
currentValue：必须。 数组中正在处理的当前元素。
index：可选。当前元素在数组中的索引值
array：可选。当前元素属于的数组对象
const array = [6, 7, 8];
let newArr = array.map(item => {
return item * 2
})
console.log(array);// [6, 7, 7]
console.log(newArr);//[ 12, 14, 16 ]
4、Array.filter（）
过滤数组（数组筛选），创建一个通过测试的新数组
var newArray = arr.filter(callback(element[, index[, array]])[, thisArg])
let ages = [32, 33, 16, 40];
let newAge = ages.filter(item => {
return item >= 18;
})
console.log(newAge); //[ 32, 33, 40 ]
5、Array.indexOf（）
返回值是首个被找到的元素在数组中的索引位置; 若没有找到则返回 -1
arr.indexOf(searchElement[, fromIndex])
searchElement： 要查找的元素
fromIndex ：可选， 开始查找的位置 ， -1表示从最后一个元素开始查找 。
let array = [2, 5, 9];
array.indexOf(2); // 0
array.indexOf(2, -3); // 0
6、Array.find（）
返回通过测试的第一个数组元素的值--适用于精准搜索，性能优化元素
const arr = [
{name:"Jim",age:"20"},
{name:"Lily",age:"18"}
]
arr.find((item)=>{
return item.age == '18'
})
//{name:"Lily",age:"18"}
