在JS中,数组方法是非常重要且常用的方法.在此整理总结一番.
1. javaScript常用数组方法

 

2.方法详解

1.push();

功能: 在数组最后一位添加一个或多个元素,并返回新数组的长度,改变原数组.(添加多个元素用逗号隔开)
 

 var arr = [1, 2, "c"];var rel = arr.push("A", "B");console.log(arr); // [1, 2, "c", "A", "B"]console.log(rel); //  5  (数组长度)

2.unshift();

功能: 在数组第一位添加一个或多个元素，并返回新数组的长度，改变原数组。(添加多个元素用逗号隔开)

 var arr = [1, 2, "c"];var rel = arr.unshift("A", "B");console.log(arr); // [ "A", "B",1, 2, "c"]console.log(rel); //  5  (数组长度)

3.pop();

功能：删除数组的最后一位，并且返回删除的数据，会改变原来的数组。(该方法不接受参数,且每次只能删除最后一个)

   var arr = [1, 2, "c"];var rel = arr.pop();console.log(arr); // [1, 2]console.log(rel); // c

4.shift();

功能：删除数组的第一位数据，并且返回被删除的数据，会改变原来的数组。(该方法同pop()；一样不接受参数,且每次只能删除数组第一个)

    var arr = ["a","b", "c"];var rel = arr.shift();console.log(arr); // ['b', "c"]console.log(rel); // a

5.reverse();

功能：将数组的数据进行反转，并且返回反转后的数组，会改变原数组

  var arr = [1, 2, 3, "a", "b", "c"];var rel = arr.reverse();console.log(arr); //    ["c", "b", "a", 3, 2, 1]console.log(rel); //    ["c", "b", "a", 3, 2, 1]

6.sort();

sort() 方法是最强大的数组方法之一。

sort(); 方法用于对数组的元素进行排序,并返回数组。默认排序顺序是根据字符串Unicode码点。
例1：
 

  var arr1 = [10, 1, 5, 2, 3];arr1.sort();console.log(arr1);

打印结果：

  var arr1 = [{ name: "老八", age: "38" },{ name: "赵日天", age: "28" },{ name: "龙傲天", age: "48" },];arr1.sort(function (a, b) {console.log(a, b);return b.age - a.age;});console.log(arr1);

结果并不是我们想要的排序结果，因为它是根据unicode编码来排序的,这也显示了其不稳定性。

语法： arr.sort(function(a,b))
参数： function可选。用来指定按某种顺序进行排列的函数。如果省略，元素按照转换为的字符串的诸个字符的Unicode位点进行排序。
具体用法：

如果 function(a, b) {return: a - b;} ，=> a - b > 0 那么 a 会被排列到 b 之前; (从小到大排序)
如果 function(a, b) {return: b - a;} ，=> b - a > 0 那么b会被排列到 a 之前； (从大到小排序)
那么我们就可以运用以上所说的function(a,b)去完成对数字的排序:

    var arr = [10, 1, 5, 2, 3];arr.sort(function (a, b) {return a - b;});console.log(arr);

打印结果：
元素为对象时（可按其中某个属性来排序）：

  var arr1 = [{ name: "老八", age: "38" },{ name: "赵日天", age: "28" },{ name: "龙傲天", age: "48" },];arr1.sort(function (a, b) {console.log(a, b);return b.age - a.age;});console.log(arr1);

打印结果：（按 age 排序（大到小））
 

7.splice();

功能：向数组中添加，或从数组删除，或替换数组中的元素，然后返回被删除/替换的元素所组成的数组。可以实现数组的增删改；
　
　 语法： arrayObject.splice(index,howmany,item1,…,itemX)
　 参数：

例，删除arr()中第三个元素并添加 ”add1“ "add2"元素

 var arr = ["a", "b", "c", 2, 3, 6];var rel = arr.splice(2, 1, "add1", "add2");console.log(arr);   //原数组console.log(rel);	//新数组 

8.concat();

功能： 数组的拼接(将多个数组或元素拼接形成一个新的数组),不改变原数组
如果拼接的是数组 则将数组展开,之后将数组中的每一个元素放到新数组中.
如果是其他类型, 直接放到新数组中
另外，如果不给该方法任何参数，将返回一个和原数组一样的数组（复制数组）

    var arr1 = [1, 2, 3];var arr2 = ["a", "b", "c"];var arr3 = ["A", "B", "C"];var rel = arr1.concat(arr2, arr3);console.log(arr1); //原数组console.log(rel); //新数组

打印结果：
可以看到原数组 arr1() 并没有被改变，该方法不改变原数组，后续不改变原数组方法将不再打印原数组
 

9.join();

功能：用特定的字符,将数组拼接形成字符串 (默认",")

   var list = ["a", "b", "c", "d"]; // "a-b-c-d"var result = list.join("-");     //"a-b-c-d"var result = list.join("/");     //"a/b/c/d"var result = list.join("");      //"abcd"var result = list.join();        //  a,b,c,dconsole.log(result);

10.slice();
功能： 裁切指定位置的数组，返回值为被裁切的元素形成的新数组 ，不改变原数组
同concat() 方法 slice() 如果不传参数,会使用默认值,得到一个与原数组元素相同的新数组 (复制数组)

语法： arr[].slice(startIndex,endIndex)
参数
 

14.lastIndexOf();

功能: 查询某个元素在数组中最后一次出现的位置 (或者理解为反向查询第一次出现的位置) 存在该元素,返回下标,不存在 返回 -1 (可以通过返回值 变相的判断是否存在该元素)

    var list = [1, 2, 3, 4];var index = list.lastIndexOf(4); //3var index = list.lastIndexOf("4"); //-1console.log(index);

15.forEach();
功能: 遍历数组,每次循环中执行传入的回调函数 。(注意: forEach() 对于空数组是不会执行回调函数的。) 没有返回值,或理解为返回值为undefined,不改变原数组.
语法:

arr[].forEach(function(value,index,array){
　 　//do something
})

参数: item:每次循环的当前元素, index:当前项的索引, array:原始数组；

数组中有几项，那么传递进去的匿名回调函数就需要执行几次；

实例1.

 var list = [32, 93, 77, 53, 38, 87];var res = list.forEach(function (item, index, array) {console.log(item, index, array);});console.log(res);

实例2: 数组中元素的和

    var list = [32, 93, 77, 53, 38, 87];var sum = 0;list.forEach(function (item) {console.log(item);sum += item;});console.log(sum);

16.map();
功能: 遍历数组, 每次循环时执行传入的回调函数,根据回调函数的返回值,生成一个新的数组 ,
同forEach() 方法,但是map()方法有返回值,可以return出来;
语法:

arr[].map(function(item,index,array){
　　//do something
　　return XXX
})

参数： item:每次循环的当前元素, index:当前项的索引, array:原始数组；

示例:

    var list = [32, 93, 77, 53, 38, 87];var res = list.map(function (item, index, array) {return item + 5 * 2;});console.log("原数组", list);console.log("新数组", res);

17.filter();
功能: 遍历数组, 每次循环时执行传入的回调函数,回调函数返回一个条件,把满足条件的元素筛选出来放到新数组中.
语法:

arr[].filter(function(item,index,array){
　　//do something
　　return XXX //条件
})

参数： item:每次循环的当前元素, index:当前项的索引, array:原始数组；
示例:

   var list = [32, 93, 77, 53, 38, 87];var resList = list.filter(function (item, index, array) {return item >= 60; // true || false});console.log(resList);

打印结果:
 

18.every();

功能: 遍历数组, 每次循环时执行传入的回调函数,回调函数返回一个条件,全都满足返回true 只要有一个不满足 返回false => 判断数组中所有的元素是否满足某个条件

 var list = [32, 93, 77, 53, 38, 87];var result = list.every(function (item, index, array) {console.log(item, index, array);return item >= 50;});console.log(result);

打印结果:false

19.some();

    var list = [32, 93, 77, 53, 38, 87];var result = list.some(function (item, index, array) {return item >= 50;});console.log(result);

    var arr = [2, 3, 4, 5];var sum = arr.reduce(function (prev, item, index, array) {console.log(prev, item, index, array);return prev + item;});console.log(arr, sum);

   	var arr = [2, 3, 4, 5];var sum = arr.reduce(function (prev, item, index, array) {console.log(prev, item, index, array);return prev + item;}, 0);console.log(arr, sum);

let site = ['runoob', 'google', 'taobao'];site.includes('runoob'); 
// true site.includes('baidu'); 
// false

    var all = {0: "张飞",1: "28",2: "男",3: ["率土", "鸿图", "三战"],length: 4,};var list = Array.from(all);console.log(all);console.log(list, Array.isArray(list));

    var list = [55, 66, 77, 88, 99, 100];var res= list.find(function (item, index, array) {return item > 60;});console.log(res); //66

      let arr = [{ id: 1, name: 'coco' }, { id: 2, name: 'dudu' }]let res = arr.find(item => item.id == 1)console.log('res', res)  //res {id: 1, name: "coco"}

   var list = [55, 66, 77, 88, 99, 100];var index = list.findIndex(function (item, index, array) {console.log(item, index, array);return item > 60;});console.log(index); // 1

      let arr = [{ id: 1, name: 'coco' }, { id: 2, name: 'dudu' }]let res = arr.findIndex(item => item.id == 1)console.log('res', res)  //res 0

 var result = ["a", "b", "c"].fill("填充", 1, 2);

    var list = [1, 2, [3, 4, [5]]];var arr = list.flat(); // 默认拉平一次console.log("拉平一次", arr);var arr = list.flat(2); // 拉平2次console.log("拉平两次", arr);

    var list = [55, 66, 77, 88, 99, 100];var newArr = list.map(function (item, index) {return [item, index];});console.log("Map方法:", newArr);var newArr = list.flatMap(function (item, index) {return [item, index];});console.log("flatMap方法:", newArr);