数组常用的20个方法

大家好，欢迎来到IT知识分享网。

1.join( )

 var arr = [1, 2, 3]; console.log(arr.join()); // 返回 1,2,3 console.log(arr.join('')); // 返回 123 console.log(arr.join('-')); // 返回 1-2-3 

2. map( )

var arr = [1, 2, 3, 4]; var arr2 = arr.map((item,index,array) => { // item 是遍历的数组内容 // index 是对应元素在数组中的下标 // array 是数组本身 return item * 2 }); console.log(arr); // 返回 [1, 2, 3, 4] console.log(arr2); // 返回 [2, 4, 6, 8]

3. forEach( )

对数组进行遍历循环,没有返回值。

 var arr = [11, 22, 33, 44, 55, 66]; var arr2 = arr.forEach((item, index, array) => { // item是遍历的数组内容 // index是对应元素在数组中的下标 // array是数组本身 console.log(item, index, array); // 打印结果: // 11 0 [11, 22, 33, 44, 55, 66] // 22 1 [11, 22, 33, 44, 55, 66] // 33 2 [11, 22, 33, 44, 55, 66] // 44 3 [11, 22, 33, 44, 55, 66] // 55 4 [11, 22, 33, 44, 55, 66] // 66 5 [11, 22, 33, 44, 55, 66] }); 

4. filter( )

有过滤遍历功能，返回满足过滤条件的元素，并组成数组。

 var arr = [1, 2, 3, 4, 5, 6, 7, 8]; var arr2 = arr.filter((item, index) => { return item > 5 }); console.log(arr2); // 返回值 [6, 7, 8] 

5. push( )

从数组的末尾向数组添加元素，可以添加一个或者多个元素。

 var arr = [1]; arr.push(2); console.log(arr); // 返回值 [1, 2] arr.push(3, 4, 5); console.log(arr); // 返回值 [1, 2, 3, 4, 5] 

6. pop( )

用于删除数组的最后一个元素,并返回删除的元素。

 var arr = ["Lily", "lucy", "Tom"]; var arr2 = arr.pop(); console.log(arr); // 返回值 ['Lily', 'lucy'] console.log(arr2); // 返回值 Tom 

7. shift( ) 

用于把数组的第一个元素删除，并返回第一个元素的值。

 var arr = ["Tom", "Jack", "Sean"]; var arr2 = arr.shift(); console.log(arr); // 返回值 ['Jack', 'Sean'] console.log(arr2); // 返回值 Tom 

8. unshift( ) 

可以向数组的开头添加一个或者多个元素，并返回新的数组长度。

 var arr = ["Tom", "Jack", "Sean"]; var arr2 = arr.unshift('lisi'); console.log(arr); // 返回值 ['lisi', 'Tom', 'Jack', 'Sean']; var arr3 = arr.unshift('zhaoliu', 'wangwu'); console.log(arr); // 返回值  ['zhaoliu', 'wangwu', 'lisi', 'Tom', 'Jack', 'Sean']; console.log(arr2, arr3); // 返回值 4 6 

9.some( )

 var arr = [1, 2, 3, 4, 5, 6]; var bool = arr.some((value, index, self) => { // value 是遍历的数组内容 // index 是对应元素在数组中的下标 // self 是数组本身 return value > 5 }) console.log(bool) //返回值 true; var bool2 = arr.some((value, index, self) => { return value > 6 }) console.log(bool2) //返回值 false; 

10. sort( )

 var arr = [1, 9, 5, 3, 7]; var arr2 = ['z', 'a', 'f', 'b', 'h', 'x']; // 默认排序 console.log(arr.sort()); // 返回值 [1, 3, 5, 7, 9] console.log(arr2.sort()); // 返回值 ['a', 'b', 'f', 'h', 'x', 'z'] 

11.slice( ) 

 const arr = ['ant', 'bison', 'camel', 'duck', 'elephant']; 

(1)在只有一个参数的情况下， .slice()方法返回从该参数指定位置开始到当前数组末尾的所有元素。

 console.log(arr.slice(2)); // 返回值 ["camel", "duck", "elephant"] 

(2)如果有两个参数，该方法返回起始位置和结束位置之间的元素，但不包括结束位置的元素。

 console.log(arr.slice(1, 5)); // 返回值 ["bison", "camel", "duck", "elephant"] 

 console.log(arr.slice(-1)); // 返回值 ['elephant'] console.log(arr.slice(1, -2)); // 返回值 ['bison', 'camel'] console.log(arr); // 返回值 ['ant', 'bison', 'camel', 'duck', 'elephant'] (原数组没变) 

12. splice()

(1)、删除元素,并返回删除的元素

 var arr = [1, 3, 5, 7, 9, 11]; var arrRemoved = arr.splice(0, 2); console.log(arr); // 返回值 [5, 7, 9, 11] console.log(arrRemoved); // 返回值 [1, 3] 

(2)、向指定索引处添加元素

 var array1 = [22, 3, 31, 12]; array1.splice(1, 0, 12, 35); console.log(array1); // 返回值 [22, 12, 35, 3, 31, 12] 

(3)、替换指定索引位置的元素

 const array1 = [22, 3, 31, 12]; array1.splice(1, 1, 8); console.log(array1); // 返回值 [22, 8, 31, 12] 

13. reverse()

 var arr = [13, 24, 51, 3]; console.log(arr.reverse()); // 返回值 [3, 51, 24, 13] console.log(arr); //返回值 [3, 51, 24, 13] (原数组改变) 

14. concat( )

(1)两个数组合并

 var arr = [1, 3, 5, 7]; var brr = [11, 13] var arrCopy = arr.concat(brr); console.log(arrCopy); // 返回值 [1, 3, 5, 7, 11, 13] console.log(arr); // [1, 3, 5, 7](原数组未被修改) 

(2)多个数组合并

 const num1 = [1, 2, 3]; const num2 = [4, 5, 6]; const num3 = ['a', 'b', 'c']; const numbers = num1.concat(num2, num3); console.log(numbers); // 返回值 [1, 2, 3, 4, 5, 6, 'a', 'b', 'c'] 

15.every( )

用于判断数组中每一项是否都满足条件，只有所有项都满足条件，才会返回true，否则返回false。

 const everyArr = [1, 30, 39, 29, 10, 13]; const everyArrisBlow = everyArr.every((item) => { return item > 10 // 检测所有元素是否都大于10 }); console.log(everyArrisBlow); // 返回值 false 

16. toString()

用于方法返回表示对象的字符串。

 function dog(name){ this.name=name; } const dog1=new dog('Gabby'); dog.prototype.toString=function dogToString(){ return `${this.name}` }; console.log(dog1.toString(),'toString数组使用方法'); 

17.indexof()

用于根据指定的数据，从左向右，查询在数组中出现的位置，如果不存在指定的数据，则返回-1，如果找到了指定的数据则返回该数据的索引。

 const indexofarr = ['ant', 'camel', 'bison', 'duck', 'bison']; console.log(indexofarr.indexOf('bison')); //返回值 2 console.log(indexofarr.indexOf('bison', 3)); //返回值 4 //如果不存在返回-1 console.log(indexofarr.indexOf('giraffe')); //返回值 -1 

18. lastIndexof()

用于从数组的末尾开始向前查找。

 var lastIndexOfarr = [1, 3, 4, 7, 7, 5, 3, 1]; console.log(lastIndexOfarr.lastIndexOf(5, 4), 'lastIndexOf数组使用方法') 

19.reduce() 

用于对数组的每一个元素执行 依次传入前一个元素计算返回值。

 const reducearr = [1, 2, 3, 4]; const initialValue = 0; const sumwithinitail = reducearr.reduce( (prevvalue, currentvalue) => prevvalue + currentvalue, initialValue ); console.log(sumwithinitail, 'reduce数组使用方法'); 

20.find（）

1、find返回数组中满足条件的第一个元素的值，否则返回undefined。

2、find方法对数组中的每个元素执行callback函数，并返回true的第一个元素值。

3、find不会改变原数组。

Array.prototype._find = function(callback){ let res = undefined for(var i=0;i<this.length;i++){ if(callback(this[i],i,this)){ res = this[i] break; } } return res }