开发过程经常需要对数组进行操作，下面总结下常见的几种函数用法,掌握这些方法，对我们开发效率有会很大的提升。
| 序号 | 函数名称 | 说明 |
|---|---|---|
| 1 | Array.isArray() | 是否为数组，函数的结果将是一个布尔值 |
| 2 | length | 返回数组的长度 |
| 3 | forEach() | 遍历数组 |
| 4 | map( ) | 遍历数组，返回新的数组 |
| 5 | filter() | 过滤数组，返回过滤后的结果 |
| 6 | sort( ) | 数组排序，修改原数组元素顺序 |
| 7 | concat( ) | 合并两个或多个数组，返回一个新的数组 |
| 8 | every( ) | 检验数组中所有元素是否都符合某个条件，结果返回一个bool值 |
| 9 | some() | 检验数组中任意元素是否都符合某个条件，结果返回一个bool值 |
| 10 | includes( ) | 校验数组中是否包含某个元素，结果返回一个bool值 |
| 11 | join( ) | 返回数组元素以分割符拼接的字符串，默认分割符"," |
| 12 | reduce() | 迭代数组元素，并且计算数组元素 |
| 13 | find() | 返回输入数组中满足 find 方法 callbackFn 中给定条件的第一个元素的值,如果未找到返回undefined |
| 14 | findIndex( ) | 返回输入数组中满足 findIndex 方法 callbackFn 中给定条件的第一个元素的索引,如果未找到返回-1 |
| 15 | indexOf( ) | 方法返回可以在输入数组中找到给定元素（作为 indexOf() 方法的参数传递）的第一个索引。如果未找到，则返回 -1 |
| 16 | fill() | 方法使用静态值更改输入数组中的所有元素。此方法返回修改后的数组 |
| 17 | slice() | 方法中传递的给定参数制作原始数组的副本，不会修改原数组 |
| 18 | splice() | 方法通过删除或替换现有项目和/或添加新项目来更改数组的内容。不会修改原始数据 |
| 19 | reverse() | 反转输入数组 |
| 20 | push() | 方法将一个或多个（任何类型的）项目添加到数组的末尾，并返回数组中项目的更新总数。 |
| 21 | pop() | 从数组中删除最后一项并返回该项。输入数组的长度减1 |
| 22 | shift() | 从数组中删除第一项并返回该项。 输入数组的长度减1，和pop()方法一样 |
| 23 | unshift() | 方法将一项或多项添加到数组的开头，并返回数组的新长度 |
| 24 | of() | 方法从可变数量的参数创建一个新的 Array 实例，而不管参数的数量或类型 |
| 25 | from() | Array.from() 静态方法从类数组或可迭代对象创建一个新的、浅复制的 Array 实例 |
| 26 | flat() | flat()方法创建一个新数组，其中所有子数组项以递归方式连接到指定深度 |
| 27 | at() | 方法将一个整数作为参数，并返回输入数组中该索引处的项目 |
1、Array.isArray()
是否为数组，函数的结果将是一个布尔值。
console.log(Array.isArray([1,2,3,4])) //打印true
console.log(Array.isArray("abc")) //打印false
console.log(Array.isArray({"a":1})) //打印false
2、length
是个属性，不是一个函数，返回数组的长度。
console.log([1,2,3,4].length)
3、forEach()
遍历数组每个元素，参数为一个函数。
['apple', 'banana', 'carrot'].forEach((arrItem, index) => {
console.log(index + ' => ' + arrItem);
})
// 0 => apple
// 1 => banana
// 2 => carrot
参数为一个箭头函数，arrItem 为元素变量, index 索引变量。
4、map()
map() 方法的行为类似于 forEach，但主要区别在于，它返回一个新数组作为结果。
const arr = [2, 4, 6, 8, 16];
const mapResult = arr.map(arrItem => arrItem * 2);
console.log(mapResult);
/*[
4,
8,
12,
16,
32
]
*/
arr每个数组元素乘以2，然后将结果保存，并返回给mapResult，arr数组并不会发生改变。
5、filter()
filter() 方法的行为类似于 map() 并返回一个数组作为结果。它返回一个过滤后的结果数组。
const arr = [2, 4, 6, 8, 16];
const filterResult =
arr.filter(arrItem => arrItem < 5 );
console.log(filterResult);
/*
[
2,
4
]
*/
返回元素值小于5的元素组成的新数组。
6、sort
sort() 方法按字母顺序对输入数组进行排序。默认情况下，sort() 函数将值作为字符串进行排序，会修改数组值。
const arr = ['banana', 'orange', 'apple', 'mango'];
arr.sort();
console.log(arr);
/*
[
"apple",
"banana",
"mango",
"orange"
]
*/
每个数组元素，按照字母顺序比较。
const arr = [22, 14, 0, 100, 89, 201];
arr.sort();
/*
[
0,
100,
14,
201,
22,
89
]
*/
100 排在了 14 前面，说是按照字符串比较，并不是按照数值比较。
const arr = [22, 14, 0, 100, 89, 201];
arr.sort((a,b)=> b-a);
/*
[
201,
100,
89,
22,
14,
0
]
*/
传递箭头函数，a 代表前一个元素，b 待会后一个，如果 b-1 的值小于0 就正序，否则就倒序。
7、concat()
concat() 方法用于合并两个或多个数组。它不会更改现有数组，而是返回一个新的结果数组。
const letters = ['a', 'b', 'c'];
const numbers = [1, 2, 3];
const arr = letters.concat(numbers,["abc","bcd"]); console.log(arr);
// ['a', 'b', 'c', 1, 2, 3, 'abc', 'bcd']
letters 不会被修改。
8、every()
every()，方法测试输入数组中的所有元素是否都符合条件。它返回一个布尔值。
const arr1 = [89, 0, -4, 34, -1, 10];
const arr2 = [89, 0, 45, 34, 1, 100];
arr1.every(arrItem => arrItem >= 0);
// false
arr2.every(arrItem => arrItem >= 0);
//true
9、some()
some()函数和every相似，它校验数组中任意元素符合条件，就返回true，否则返回false。
const arr1 = [89, 0, 44, 34, -1, 10];
const arr2 = [-8, -45, -1, -100, -9];
arr1.some(arrItem => arrItem >= 0);
// true
arr2.some(arrItem => arrItem >= 0);
// false
10、includes( )
检验数组中是否包含某个值，如果包含，返回true，否则false
const arr = [1, "2", 3, 4, 5];
console.log(arr.includes("2"));
//true
11、json()
join() 该方法返回数组元素拼接组成的字符串，参数为分割符，不指定分割符，默认以逗号分割。
const arr = ['Hello', 'World', '!'];
arr.join();
// 'Hello,World,!'
arr.join(',');
// 'Hello, World, !'
arr.join(' + ');
// 'Hello + World + !'
12、reduce()
reduce 用来遍历数组，参数为函数，参数为prevVal, currVal，prevVal 为上一次函数返回结果，currVal 当前数组元素值。
const arr = [1, 2, 3, 4];
const reducer = (prevVal, currVal) => prevVal + currVal;
arr.reduce(reducer);
//10
const arr = ["hello","world","！"];
const reducer = (prevVal, currVal) => prevVal+","+currVal;
arr.reduce(reducer);
//hello,world,！
13、find()
find 根据传入的函数条件，来查找数组中的符合条件的第一个元素，如果未查询到，返回undefined
const arr = [5, 10, 100, 12, 8, 130, 44];
const result = arr.find(arrItem => arrItem >= 10);
console.log(result);
//10
14、findIndex( )
和find功能类似，区别在于返回查到符合条件的第一个元素的索引值，如果未找到返回-1
const arr = [5, 10, 100, 12, 8, 130, 44];
const result = arr.findIndex(arrItem => arrItem >= 10);
console.log(result);
//1
15、indexOf( )
返回给元素的索引，如果未找到返回-1
const arr = [5, 10, 100, 12, 8, 130, 44];
arr.indexOf(12);
//3
arr.indexOf(99);
-1
16、fill()
fill() 方法使用静态值更改输入数组中的所有元素。此方法返回修改后的数组。
const arr1 = ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H'];
arr1.fill(0);
// [0, 0, 0, 0, 0, 0, 0, 0]
const arr2 = ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H'];
arr2.fill(0, 5);
// ['A', 'B', 'C', 'D', 'E', 0, 0, 0]
const arr3 = ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H'];
arr3.fill(0, 5, 7);
// ['A', 'B', 'C', 'D', 'E', 0, 0, 'H']
const arr4 = [1, 2, 3, 4, 5];
arr4.fill();
//[undefined, undefined, undefined, undefined, undefined]
17、slice()
slice基于原数组返回输出索引开始位置和和结束位置之间的数据组成的副本，不会修改原数组。
const arr = ['rats', 'sheep', 'cows', 'chickens', 'dogs', 1001];
arr.slice();
// ['rats', 'sheep', 'cows', 'chickens', 'dogs', 1001]
arr.slice(3);
// ['chickens', 'dogs', 1001]
arr.slice(2, 5);
// ['cows', 'chickens', 'dogs']
arr.slice(-4);
// ['cows', 'chickens', 'dogs', 1001]
18、splice()
splice() 方法通过删除或替换现有项目和/或添加新项目来更改数组的内容。返回删除的数组元素
const arr = ['angel', 'clown', 'mandarin', 'sturgeon'];
const removedArr = arr.splice(2, 0, 'drum');
console.log(arr);
console.log(removedArr);
//VM174:3 (5) ['angel', 'clown', 'drum', 'mandarin', 'sturgeon']
//VM174:4 []
索引2位置之后删除第0个元素，并且写入“drum”。
const arr = ['angel', 'clown', 'mandarin', 'sturgeon'];
const removedArr = arr.splice(2, 0, 'drum', 'guitar');
console.log(arr);
console.log(removedArr);
//VM178:3 (6) ['angel', 'clown', 'drum', 'guitar', 'mandarin', 'sturgeon']
//VM178:4 []
索引2位置之后删除第0个元素，并且写入'drum', 'guitar'。
const arr = ['angel', 'clown', 'drum', 'mandarin', 'sturgeon'];
const removedArr = arr.splice(3, 1);
console.log(arr);
console.log(removedArr);
//VM182:3 (4) ['angel', 'clown', 'drum', 'sturgeon']
//VM182:4 ['mandarin']
索引位置3开始，删除一个元素。
const arr = ['angel', 'clown', 'drum', 'sturgeon'];
const removedArr = arr.splice(2, 1, 'trumpet');
console.log(arr);
console.log(removedArr);
//VM186:3 (4) ['angel', 'clown', 'trumpet', 'sturgeon']
//VM186:4 ['drum']
索引位置2开始，删除一个元素，并且写入trumpet。
const arr = ['angel', 'clown', 'trumpet', 'sturgeon'];
const removedArr = arr.splice(0, 2, 'parrot', 'anemone', 'blue');
console.log(arr);
console.log(removedArr);
//VM200:3 (5) ['parrot', 'anemone', 'blue', 'trumpet', 'sturgeon']
//VM200:4 (2) ['angel', 'clown']
索引位置0开始，删除两个元素，并且写入'parrot', 'anemone', 'blue'
19、reverse()
reverse() 方法反转输入数组，会修改原数组
const arr1 = [1, 2, 3];
arr1.reverse();
//(3) [3, 2, 1]
20、push()
往数组中追加元素，返回最新数组的长度，会修改元素数组。
const animals = ['cats', 'rats', 'sheep'];
animals.push('cows');
// 4
console.log(animals);
// ['cats', 'rats', 'sheep', 'cows']
21、pop()
pop() 方法从数组中删除最后一项并返回该项。输入数组的长度减1。
const arr = ['rats', 'sheep', 'cows', 'chickens', 'dogs', 1001];
arr.pop();
// 1001
console.log(arr);
//VM307:4 (5) ['rats', 'sheep', 'cows', 'chickens', 'dogs']
22、shift()
shift() 方法从数组中删除第一项并返回该项。 输入数组的长度减1。
const arr = ['rats', 'sheep', 'cows', 'chickens', 'dogs', 1001];
arr.shift();
// 'rats'
console.log(arr);
//VM311:5 (5) ['sheep', 'cows', 'chickens', 'dogs', 1001]
23、unshift()
unshift() 方法将一项或多项添加到数组的开头，并返回数组的新长度.
const animals = ['cats', 'rats', 'sheep'];
animals.unshift('cows');
// 4
console.log(animals);
//VM315:5 (4) ['cows', 'cats', 'rats', 'sheep']
24、Array.of()
Array.of() 方法从可变数量的参数创建一个新的 Array 实例，而不管参数的数量或类型。
Array.of(1);
// [1]
Array.of(1, 2, 3);
// [1, 2, 3]
Array.of(undefined);
// [undefined]
25、Array.from()
Array.from() 静态方法从类数组或可迭代对象创建一个新的、浅复制的 Array 实例。
Array.from('hello');
// ['h', 'e', 'l', 'l', 'o']
Array.from([1, 2, 3], arrItem => arrItem * 4);
//(3) [4, 8, 12]
26、 flat()
将一个数组的子数组元素放入到同级，参数深度，默认为1，返回一个新数组。不会修改原数组。
const arr1 = [0, 1, 2, [3, 4]];
console.log(arr1.flat());
// [0, 1, 2, 3, 4]
const arr2 = [0, 1, 2, [[[3, 4]]]];
console.log(arr2.flat(2));
// [0, 1, 2, [3, 4]]
console.log(arr2.flat(3));
//[0, 1, 2, 3, 4]
27、at()
at() 方法将一个整数作为参数，并返回输入数组中该索引处的项目,参数可以是正数或负数。 负整数从输入数组的最后一项开始计数。
const arr = ['chickens', 'dogs', 1001, 'cows', 'cats', 'sheep']
arr.at(1);
// 'dogs'
arr.at(-1);
// 'sheep'
arr.at(2);
// 1001
arr.at(-2);
// 'cats'
arr.at(-100);
// undefined
