数组常用方法、Array

1、数组常用方法 序号 方法（函数） 版本 功能描述 是否改变原数组 1 map() ES5 此方法是将数组中的每个元素调用一个提供的函数，结果作为一个新的数组返回，并没有改变原来的数组 N 2 forEach() ES5 此方法是将数组中的每个元素执行传进提供的函数，没有返回值，注意和map方法区分 N 3 filter() ES5 此方法是将所有元素进行判断，将满足条件的元素作为一个新的数组返回 N 4 every() ES5 此方法是将所有元素进行判断返回一个布尔值，如果所有元素都满足判断条件，则返回true，否则为false N 5 some() ES5 此方法是将所有元素进行判断返回一个布尔值，如果存在元素都满足判断条件，则返回true，若所有元素都不满足判断条件，则返回false N 6 reduce() ES5 此方法是所有元素调用返回函数，返回值为最后结果,传入的值必须是函数类型 N 7 push() ES5- 此方法是在数组的后面添加新加元素，此方法改变了数组的长度 Y 8 pop() ES5- 此方法在数组后面删除最后一个元素，并返回数组，此方法改变了数组的长度 Y 9 shift() ES5- 此方法在数组后面删除第一个元素，并返回数组，此方法改变了数组的长度 Y 10 unshift() ES5- 此方法是将一个或多个元素添加到数组的开头，并返回新数组的长度 Y 11 isArray() ES5+ 判断一个对象是不是数组，返回的是布尔值 N 12 concat() ES5- 此方法是一个可以将多个数组拼接成一个数组 N 13 toString() ES5- 此方法将数组转换成字符串，类似于没有参数的 join() 方法。该方法会在数据发生隐式类型转换时被自动调用，如果手动调用，就是直接转为字符串。不会改变原数组 N 14 join() ES5- 此方法将数组转为字符串并返回转化的字符串数据，不会改变原来的数组 N 15 splice() ES5- Array.splice(开始位置， 删除的个数，元素) ，万能方法，可以实现增删改 Y 16 slice() ES5- 此方法截取指定位置的数组，并且返回截取的数组，不会改变原数组 N 17 reverse() ES5- 此方法将数组的数据进行反转，并且返回反转后的数组，会改变原数组 Y 18 sort() ES5- 此方法对数组内的数据进行排序(默认为升序)，并且返回排过序的新数组，会改变原来的数组 Y 19 valueOf() ES5- 此方法返回数组的原始值（一般情况下其实就是数组自身），一般由js在后台调用，并不显式的出现在代码中 N 20 indexOf() ES5 此方法根据指定的数据，从左向右，查询在数组中出现的位置，如果不存在指定的数据，返回-1，找到了指定的数据返回该数据的索引 N 21 lastIndexOf() ES5 此方法可返回一个指定的字符串值最后出现的位置，如果指定第二个参数 start，则在一个字符串中的指定位置从后向前搜索 N 22 reduceRight() ES5 此方法与 reduce 类似，从数组的最后一项开始，向前逐个遍历到第一位，迭代数组的所有项，然后构建一个最终返回的值 N 23 includes() ES6 此方法方法用来判断一个数组是否包含一个指定的值，如果是返回 true，否则false N 24 flat() ES6 此方法方法用来实现数组扁平化 Y 2、数组常用方法相关链接

1. 知乎
2. CSDN

3、数组常用方法案例 3.1、Array.map()

Array.map()，此方法是将数组中的每个元素调用一个提供的函数，结果作为一个新的数组返回，并没有改变原来的数组。

let arr = [1, 2, 3, 4, 5]; let newArr = arr.map(x => x*2); // arr = [1, 2, 3, 4, 5] 原数组保持不变 // newArr = [2, 4, 6, 8, 10] 返回新数组 

3.2、Array.forEach()

Array.forEach()，此方法是将数组中的每个元素执行传进提供的函数，没有返回值，注意和map方法区分。

let arr = [1, 2, 3, 4, 5]; num.forEach(x => x*2); // arr = [1, 2, 3, 4, 5] 数组改变,注意和map区分 

3.3、Array.filter()

Array.filter()，此方法是将所有元素进行判断，将满足条件的元素作为一个新的数组返回。

let arr = [1, 2, 3, 4, 5]; const isBigEnough = value => value >= 3; let newArr = arr.filter(isBigEnough); // newNum = [3, 4, 5] 满足条件的元素返回为一个新的数组 

3.4、Array.every()

Array.every()，此方法是将所有元素进行判断返回一个布尔值，如果所有元素都满足判断条件，则返回true，否则为false。

let arr = [1, 2, 3, 4, 5]; const isLessThan4 = value => value < 4; const isLessThan6 = value => value < 6; arr.every(isLessThan4); // false arr.every(isLessThan6); // true 

3.5、Array.some()

Array.some()，此方法是将所有元素进行判断返回一个布尔值，如果存在元素都满足判断条件，则返回true，若所有元素都不满足判断条件，则返回false。

let arr= [1, 2, 3, 4, 5]; const isLessThan4 = value => value < 4; const isLessThan6 = value => value > 6; arr.some(isLessThan4); // true arr.some(isLessThan6); // false 

3.6、Array.reduce()

Array.reduce()，此方法是所有元素调用返回函数，返回值为最后结果，传入的值必须是函数类型。

let arr = [1, 2, 3, 4, 5]; const add = (a, b) => a + b; let sum = arr.reduce(add); // sum = 15  相当于累加的效果 // 与之相对应的还有一个 Array.reduceRight() 方法， // 区别是这个是从右向左操作的 

3.7、Array.push()

Array.push()，此方法是在数组的后面添加新加元素，此方法改变了数组的长度。

var str1 = [12,2,"hello"]; var str2 = [43,2,"test"]; console.log(str1.push("你好")); // 4 console.log(str2.push("hello","world")); // 5 console.log(str1); // [12, 2, "hello","你好"] console.log(str2); // [43, 2, "test","hello", "world"] 

3.8、Array.pop()

Array.pop()，此方法在数组后面删除最后一个元素，并返回数组，此方法改变了数组的长度。

let arr = [1, 2, 3, 4, 5]; arr.pop(); console.log(arr); // [1, 2, 3, 4] console.log(arr.length); // 4 

3.9、Array.shift()

Array.shift()，此方法删除数组第一个元素，并返回数组，此方法改变了数组的长度。

let arr = [1, 2, 3, 4, 5]; arr.shift(); console.log(arr); // [2, 3, 4, 5] console.log(arr.length); // 4 

3.10、Array.unshift()

Array.unshift()，此方法是将一个或多个元素添加到数组的开头，并返回新数组的长度。

var str1 = [12,2,"hello"]; var str2 = [43,2,"test"]; console.log(str1.unshift("你好")); // 4 console.log(str2.unshift("hello","world")); // 5 console.log(str1); // ["你好", 12, 2, "hello"] console.log(str2); // ["hello", "world", 43, 2, "test"] 

3.11、Array.isArray()

Array.isArray()，判断一个对象是不是数组，返回的是布尔值。

let arr = [1, 2, 3, 4, 5], obj = { name: '半晨' }; console.log(Array.isArray(arr)); // true console.log(Array.isArray(obj)); // false 

3.12、Array.concat()

Array.concat()，此方法是一个可以将多个数组拼接成一个数组。

let arr1 = [1, 2, 3]; arr2 = [4, 5]; let arr = arr1.concat(arr2); console.log(arr); // [1, 2, 3, 4, 5] 

3.13、Array.toString()

Array.toString()，此方法将数组转换成字符串，类似于没有参数的 join() 方法。该方法会在数据发生隐式类型转换时被自动调用，如果手动调用，就是直接转为字符串。不会改变原数组。

let arr = [1, 2, 3, 4, 5]; let str = arr.toString(); console.log(str); // 1,2,3,4,5 

3.14、Array.join()

Array.join()，此方法将数组转为字符串并返回转化的字符串数据，不会改变原来的数组。

let arr = [1, 2, 3, 4, 5]; let str1 = arr.toString(); let str2 = arr.toString(','); let str3 = arr.toString('##'); console.log(str1); // 12345 console.log(str2); // 1,2,3,4,5 console.log(str3); // 1##2##3##4##5 

3.15、Array.splice()

Array.splice()，Array.splice(开始位置， 删除的个数，元素) ，万能方法，可以实现增删改。

let arr = [1, 2, 3, 4, 5]; let arr1 = arr.splice(2, 0 'haha'); let arr2 = arr.splice(2, 3); let arr1 = arr.splice(2, 1 'haha'); console.log(arr1); // [1, 2, 'haha', 3, 4, 5] 新增一个元素 console.log(arr2); // [1, 2] 删除三个元素 console.log(arr3); // [1, 2, 'haha', 4, 5] 替换一个元素 

3.16、Array.slice()

Array.slice()，此方法截取指定位置的数组，并且返回截取的数组，不会改变原数组。

var arr = ["T1","J1","L1","L2","M1"]; console.log(arr.slice(1,3)); // ["J1","L1"] console.log(arr.slice(1)); // ["J1","L1","L2","M1"] console.log(arr.slice(-4,-1)); // ["J1","L1","L2"] console.log(arr.slice(-2)); // ["Lily","M1"] console.log(arr.slice(1,-2)); // ["J1","L1"] console.log(arr); // ["T1","J1","L1","L2","M1"] 

3.17、Array.reverse()

Array.reverse()，此方法将数组的数据进行反转，并且返回反转后的数组，会改变原数组。

var str1 = [12,2,"hello"]; console.log(str1.reverse()); // ["hello", 2, 12] console.log(str1); // ["hello", 2, 12] 

3.18、Array.sort()

Array.sort()，此方法对数组内的数据进行排序(默认为升序)，并且返回排过序的新数组，会改变原来的数组。

var str1 = [12,2,43,5,2,5]; var str2 = [92,2,43,"hello",'zoom',5,2,5]; console.log(str1.sort()); // [12, 2, 2, 43, 5, 5] console.log(str1); // [12, 2, 2, 43, 5, 5] console.log(str2.sort()); // [2, 2, 43, 5, 5, 92, "abc", "hello", "zoom"] console.log(str2); // [2, 2, 43, 5, 5, 92, "abc", "hello", "zoom"] 

3.19、Array.valueOf()

Array.valueOf()，此方法返回数组的原始值（一般情况下其实就是数组自身），一般由js在后台调用，并不显式的出现在代码中。

var str = [1,2,3]; console.log(str.valueOf()); // [1,2,3] console.log(str); // [1,2,3] // 为了证明返回的是数组自身 console.log(str.valueOf() == str); // true 

3.20、Array.indexOf()

Array.IndexOf()，此方法根据指定的数据，从左向右，查询在数组中出现的位置，如果不存在指定的数据，返回-1，找到了指定的数据返回该数据的索引。

var str = ["h","e","l","l","o"]; console.log(str.indexOf("l")); // 2 console.log(str.indexOf("l",3)); // 3 console.log(str.indexOf("l",4)); // -1 console.log(str.indexOf("l",-1)); // -1 console.log(str.indexOf("l",-3)); // 2 

3.21、Array.lastIndexOf()

Array.lastIndexOf()，此方法可返回一个指定的字符串值最后出现的位置，如果指定第二个参数 start，则在一个字符串中的指定位置从后向前搜索。

var str = ["h","e","l","l","o"]; console.log(str.lastIndexOf("l")); //3 console.log(str.lastIndexOf("l",3)); //3 console.log(str.lastIndexOf("l",4)); //3 console.log(str.lastIndexOf("l",-1)); //3 console.log(str.lastIndexOf("l",-3)); //2 

3.22、Array.reduceRight()

Array.reduceRight()，此方法与 reduce 类似，从数组的最后一项开始，向前逐个遍历到第一位，迭代数组的所有项，然后构建一个最终返回的值。

// null 

3.23、Array.includes()

Array.includes()，此方法方法用来判断一个数组是否包含一个指定的值，如果是返回 true，否则false。

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

3.24、Array.flat()

Array.flat()，此方法方法用来实现数组扁平化

let site = [1, 2, [3, 4]]; console.log(arr1.flat()); // [1, 2, 3, 4] 

4、数组常用方法案例相关链接

1. 知乎
2. 博客园