前言
在前端开发中关于数组的使用想必前端开发者并不陌生，尤其是在处理业务逻辑的时候，从后端获取的数据类型中数组类型基本占到70%的比例，所以与其说是处理数据，不如说是处理数组，虽然说的有点夸张，前端实际开发中关于数组相关的使用在前端开发中是非常高频的，而且在前端求职面试时候关于数组相关的函数方法也是必考知识点，非常重要。那么本篇博文就来分享一下关于JS中数组常用的方法都有哪些？汇总起来，方便后期查阅使用。
JS中数组常用方法
在JS中数组常用方法有很多，大概有16个方法左右，尤其是在前端求职面试的时候常考这些数组方法的使用，这里把数组常用的方法结合在前端面试时候的考察相结合来对比性的逐一介绍，它们分别如下所示。
1、Array.push()方法：给数组的尾部添加一个或多个元素，并返回新的数组长度（原始数组会发生改变）。
var array = [1,2,3,4,5,6];
array.push(7,8,9);
console.log(array); //输出结果为：[1,2,3,4,5,6,7,8,9]2、Array.pop()方法：删除并返回数组的最后一个元素，若该数组为空，则返回undefined（原始数组会发生改变）。
var array = [1,2,3,4,5,6,7,8,9];
var delete = array.pop();
console.log(delete); //delete=9
console.log(array); //输出结果为：[1,2,3,4,5,6,7,8]3、Array.unshift()方法：给数组的头部添加一个或多个元素，并返回新的数组长度（原始数组会发生改变）。
var array = [1,2,3,4,5,6,7,8,9];
var result = array.unshift(0);
console.log(result); //res=10;
console.log(array); //输出结果为：[0,1,2,3,4,5,6,7,8]4、Array.shift()方法：删除数组的第一项，并返回第一个元素的值。若该数组为空，则返回undefined（原始数组会发生改变）。
var array = [1,2,3,4,5,6,7,8,9];
var result = array.shift();
console.log(result); //result=1
console.log(array); //输出结果为：[2,3,4,5,6,7,8]5、Array.concat(array1,array2…)方法：合并两个或多个数组，生成一个新的数组（原始数组不变）。
var array1 = [1,2,3,4,5];
var array2 = [6,7,8,9];
var result = array1.concat(array2);
console.log(result); //输出结果为：[1,2,3,4,5,6,7,8,9]6、Array.join()方法：把数组的每一项用指定字符连接组成一个字符串，默认连接字符为 “,” 逗号。
var array = [1,2,3,4,5,6,7,8,9];
var string1 = array.join();
var string2 = array.join("+");
console.log(string1); //输出结果为：1,2,3,4,5,6,7,8,9
console.log(string2); //输出结果为：1+2+3+4+5+6+7+8+97、Array.reverse()方法：把数组倒序处理（原始数组会发生改变）。
var array = [1,2,3,4,5,6,7,8,9];
array.reverse();
console.log(array); //输出结果为：9,8,7,6,5,4,3,2,18、Array.sort()方法：对数组元素进行排序，按照字符串UniCode码排序（原始数组会发生改变）。
var array = [1,2,3,4,5,6,7,8,9];
①从小到大
var small = function(x,y){
return x-y;
}
array.sort(small);
console.log(array); //输出结果为：1,2,3,4,5,6,7,8,9②从大到小
var big = function(x,y) {
return y-x;
}
array.sort(big);
console.log(array); //输出结果为：9,8,7,6,5,4,3,2,1③按数组对象中的某个键值进行排序处理
var array = [{id:1,name:"Sum",num:"10"},{id:1,name:"Tom",num:"11"},{id:1,name:"Json",num:"12"},{id:1,name:"Denny",num:"13"},{id:1,name:"Jenny",num:"14"}];
function compare(param) {
return function num(x,y) {
return x[param]-y[param];
}
}
array.sort(compare("num"));
9、Array.map(function)方法：原数组的每一项执行函数后，返回一个新的数组（原始数组不变）。
10、Array.slice() 方法：按照条件查找出数组中的部分内容
传递的参数：
- array.slice(a, b)表示：从索引a开始查找到b处（不包含b）
- array.slice(a) 表示：第二个参数省略，则一直查找到末尾
- array.slice(0)表示：原样输出内容，可以实现数组克隆
- array.slice(-a,-b)表示： slice支持负参数，从最后一项开始算起，-1为最后一项，-2为倒数第二项
返回值：返回一个新数组，原始数组不变
示例：
var array = [1,2,3,4,5,6,7,8,9];
var result = array.slice(-3,-1);
console.log(result); //输出结果为：[2,3,8]11、Array.splice(index,x,array1,array2…) 方法：用于添加或删除数组中的元素。从index位置开始删除x个元素，并将array1、array2…的数据从index位置依次插入。当删除的x为0时，则不删除元素。原始数组不变。
示例：
var array = ["1","2","5","6","7","8","9"];
array = array.splice(2,1,"3","4");
console.log(result); //输出结果为：1,2,3,4,5,6,7,8,912、Array.forEach(function)方法：用于调用数组的每个元素，并将元素传递给回调函数。原始数组不变。（注意：forEach方法和map方法的区别，若直接打印Array.forEach()，输出结果为undefined）。
13、Array.filter(function)方法：过滤数组中符合条件的元素并返回一个新的数组。
var array = [1,2,3,4,5,6,7,8,9];
var newArray = array.filter(x => x>4);
console.log(newArray); //输出结果为：[5,6,7,8,9]14、Array.every(function)方法：对数组中的每一项进行判断操作，若都符合则返回true，否则返回false。
15、Array.some(function)方法：对数组中的每一项进行判断操作，若都不符合则返回false，否则返回true。
16、Array.reduce(function)方法：reduce() 方法接收一个函数作为累加器，数组中的每个值（从左到右）开始缩减，最终计算为一个累加值。
var array = [1,2,3,4,5];
var result = array.reduce((x,y) => x+y);
console.log(result); //输出结果为：1517、indexOf()方法：检测当前值在数组中第一次出现的位置索引。
传递的参数：array.indexOf(item,start) 其中，item表示查找的元素； start表示字符串中开始检索的位置。
返回值：第一次查到的索引，未找到返回-1。原始数组不变。
18、includes()方法：判断一个数组是否包含某一个指定的值。
传递的参数：指定的内容
返回值：布尔值。原始数组不变。
拓展
在前端求职面试中，面试官通常会这样考察数组的方法使用：
- 原始数组会发生改变的方法有哪些？回答：push pop shift unshift reverse sort splice等方法；
- 不改变原始数组的方法有哪些？回答：concat map filter join every some indexOf slice forEach等方法。
最后
通过本文关于前端开发JS中数组常用方法汇总的介绍，如果认真阅读并且实践示例，应该会很好的掌握这些知识点，整合了数组常用方法的汇总，是一篇值得阅读的文章，这些数组常用的方法相关知识点在求职面试中也甚为重要，而且在实际开发中也是必用知识点，所以说这些知识点是必备的，重要性就不在赘述。欢迎关注，一起交流，共同进步。
