JavaScript常见的操作数组的函数方法

函数	作用
join()	将数组中所有元素都转化为字符串连接在一起
sort()	将数组中的元素排序（会改变原数组）
reverse()	将数组中的元素颠倒顺序（会改变原数组）
concat()	将多个数组或数连接起来，组成一个新的数组
slice()	返回指定数组的一个片段或子数组
splice()	在数组指定位置插入或删除元素（会改变原数组）
push()	在数组的尾部添加一个或多个元素（会改变原数组）
pop()	删除数组的最后一个元素，并返回该元素（会改变原数组）
unshift()	在数组的头部添加一个或多个元素
shift()	删除数组第一个元素，并返回该元素（会改变原数组）
toString()	返回将数组每个元素转化为字符串并用逗号分隔连接起来的字符串
forEach()	从头至尾遍历数组，为每个元素调用指定的函数，无返回值（undefined）（可以通过回调函数的第三个参数修改原数组）
map()	将调用的数组的每个元素传递给指定的函数，并返回一个数组（可以通过回调函数的第三个参数修改原数组）
filter()	根据回调函数内的逻辑判断过滤数组元素，并返回一个新的数组
every()	对数组元素应用指定的函数进行判断，返回true或false
some()	对数组元素应用指定的函数进行判断，返回true或false
reduce()	使用指定的函数将数组元素进行组合
reduceRight()	使用指定的函数将数组元素进行组合,从右往左调用
indexOf()	判断一个数在该数组中的索引位置
lastIndexOf()	判断一个数在该数组中的索引位置,从数组的末尾开始搜索
find()	遍历数组，找出第一个符合回调函数的元素
findIndex()	遍历数组，找出第一个符合回调函数的元素的索引
fill()	用于填充数组（会改变原数组）
includes()	判断一个数是否在该数组中

1、join()

join() 方法主要是用于将数组内的所有元素连接在一起转化为字符串，并返回这个字符串。

参数（共1个）：

1. 为可选参数，该参数表示数组的每个元素之间的连接符号，若省略该参数，则默认为逗号

var arr = [1, 2, 3, 4]
arr.join()              //返回 "1,2,3,4"
arr.join('-')           //返回 "1-2-3-4"

2、sort()

sort() 方法是将数组中的每个元素按一定条件排序后并返回排序后的新数组（会改变原数组）
参数（共1个）：

1. 可选参数，该参数为回调函数，该回调函数需传入两个参数a和b。当回调函数返回一个小于0的数时，参数a将排在前面；当返回一个大于0的数时，参数b将排在前面；当返回0时，则这两个值不进行比较排序。若省略该参数，则将每个元素按照字母表的顺序排列

var arr = ['cherry', 'apple', 'banana']
// 省略了第一个参数，所以在排序时默认按照字母表顺序进行排列，若首字母相同，则按第二个字母的先后顺序排列。
arr.sort()           //未传入回调函数作为参数
console.log(arr)     //返回  ['apple', 'banana', 'cherry']

var arr = [54, 78, 12, 64]
// 调用sort()方法，会每次从数组中取出两个数，分别作为参数a和参数b，
// 若回调函数return一个负数，则参数a排在前面；
// 若return一个正数，则参数b排在前面；若return 0，则两个数不进行排序。
// a-b 实现了升序排列；b-a 实现降序排序
arr.sort(function (a, b) {
    return a - b
})
console.log(arr)        //返回  [12, 54, 64, 78]  升序排列

3、reverse()
reverse() 方法是将数组中的元素颠倒，并返回颠倒后的数组（会改变原数组）

var arr = [54, 78, 12, 64]

arr.reverse()
console.log(arr)       //返回  [64, 12, 78, 54]

4、concat()
concat() 方法将调用每一个参数创建并返回一个数组（不会改变原数组）

1. 该方法可以省略参数或者传入多个参数。
2. 当省略参数时，则表示创建一个新的空数组，将原始数组的数据传入这个空数组中，有点类似copy的感觉 ； 当传入1个或多个参数时，则表示创建一个新的空数组，将原始数组的数据和每个参数都添加到这个空数组中

var arr = [1,2,3,4]

var new_arr = arr.concat(5,6,7,8)
console.log(new_arr)     //返回  [1,2,3,4,5,6,7,8]

5、slice()
slice() 方法是返回指定的一个数组片段

两个参数（用负数表示元素位置时，是从末尾往前数，分别为-1 、-2 、-3……）：

1. 数组片段的起始位置（包括起始位置）
2. 数组片段的结束位置（不包括结束位置），若省略，则表示从第一个参数表示的位置一直取到最后一个元素

var arr = [1,2,3,4,5,6,7]

arr.slice(1,3)                //返回  [2,3]
arr.slice(3)                  //返回  [4,5,6,7]
arr.slice(4,-1)               //返回  [5,6]
arr.slice(-3)                 //返回  [5,6,7]
arr.slice(-3,-2)              //返回  [5]

6、splice()
splice()方法在数组指定位置插入或删除元素，并返回删除元素组成的数组（会改变原数组）
参数（共3个）：

1. 第一个参数：删除或插入元素的起始位置（包括起始位置）
2. 第二个参数：从起始位置开始往后需要删除的元素个数。若该元素省略，则表示从起始位置开始到最后的所有元素都删除
3. 第三个参数及之后的所有参数：将该值作为数组的元素依次插入到第一个参数表示的位置上

var arr = [1,2,3,4,5,6,7]

arr.splice(4)             //返回 [5,6,7],此时arr为[1,2,3,4]
arr.splice(1, 2)          //返回 [2,3],此时arr为[1,4]
arr.splice(1, 0, 'new1', 'new2') //返回[],此时arr为[1,'new1','new2',4]

7、push()
push() 方法是在数组的尾部添加一个或多个元素，并返回数组的长度（会改变原数组）

该函数的有1个或多个参数，函数依次获取每个参数将其插入到数组的末尾

var arr = []

arr.push(1)       //返回 1, 此时arr为 [1]
arr.push(5)       //返回 2, 此时arr为 [1,5]
arr.push(3,2)     //返回 4, 此时arr为 [1,5,3,2]

8、pop()
pop() 方法是删除数组的最后一个元素，并返回该元素（会改变原数组）
该函数不需要传入任何参数

var arr = [6,8,7]

arr.pop()          //返回 7, 此时arr为 [6,8]
arr.pop()          //返回 8, 此时arr为 [6]

9、unshift()
unshift() 方法是在数组的头部添加一个或多个元素，并返回数组的长度（会改变原数组）
该函数的有1个或多个参数，函数依次获取每个参数将其插入到数组的最前面

var arr = []

arr.unshift(1)       //返回 1, 此时arr为 [1]
arr.unshift(5)       //返回 2, 此时arr为 [5,1]
arr.unshift(3,2)     //返回 4, 此时arr为 [2,3,5,1]

10、shift()
shift()方法是删除数组第一个元素，并返回该元素（会改变原数组）
该函数不需要传入任何参数

var arr = [6,8,7]

arr.shift()          //返回 6, 此时arr为 [8,7]
arr.shift()          //返回 8, 此时arr为 [7]
arr.shift()          //返回 7, 此时arr为 []

11、toString()
toString() 方法是返回将数组每个元素转化为字符串并用逗号分隔连接起来的字符串（不会改变原数组）
若遇到数组里嵌套数组的话，同样也会将该嵌套数组里的每个元素转化为字符串并连接起来

[1,2,3].toString()              //返回 '1,2,3'
['cherry','apple','bannana'].toString()    //返回 'cherry,apple,banana'
[1,2,[6,7]].toString()          //返回 '1,2,6,7'
[1,[3,6,[8,9]]].toString()      //返回 '1,3,6,8,9'

12、forEach()
forEach()方法是ES5新增的，它是用来为每个元素调用指定的函数（可以修改原数组）

该方法只有一个参数，该参数为回调函数，该回调函数有三个参数，这三个参数的含义分别为数组元素 、元素的索引 、数组本身

var a = [1,2,3,4,5]
// 将某一数组内的每个元素都+2
a.forEach(function (value, index, arr) {
    arr[index] = value + 2
})
console.log(a)          // [3,4,5,6,7]

// 计算数组内各元素之和
var sum = 0
a.forEach(function(value) {
 sum += value
})
console.log(sum)       // 15

13、map()
map()方法是是ES5新增的，它是将调用的数组的每个元素传递给指定的函数，把每次调用回调函数的返回值存入到一个新的数组中，最后返回这个新的数组（不会改变原数组）

该方法只有一个参数，该参数为回调函数，该回调函数只有一个参数，该参数的含义是数组的每个元素???

该方法只有一个参数，该参数为回调函数，该回调函数有三个参数，这三个参数的含义分别为数组元素 、元素的索引 、数组本身

var arr = [1,2,3,4,5]

var new_arr = arr.map(function (value) {
    return value * value
})
console.log(new_arr)      //  [1, 4, 9, 16, 25]

14、filter()
filter() 方法是ES5新增的，相当于一个过滤器，它是通过回调函数里的逻辑判断来过滤掉不需要的元素，再将剩下的元素都放到一个新的数组中并返回（不会改变原数组）

该方法只有一个参数，该参数为回调函数，该回调函数有两个参数，他们的含义分别为数组中的元素 、 元素的索引

当回调函数的返回值为true时，即return true时，该元素将被加入到新的数组中；反之，该元素将被不被加入到新的数组中

var arr = [6,12,7,1,9,3,0,19]

var new_arr = arr.filter(function (value, index) {
    return index % 2 === 0
})
console.log(new_arr)       // [6, 7, 9, 0]

15、every()
every() 方法是针对一个数组的逻辑判定（不会改变原数组）

该方法有一个参数，该参数为回调函数，该回调函数有一个参数，该参数含义是数组中的每个元素

当每个元素调用回调函数的返回值全部都为true时，最后返回true；相反，只要有一个元素调用回调函数，返回的值不为true，最后都会返回false

var arr = [1, 2, 3, 4, 5, 6, 12, 8]

var result = arr.every(function (value) {
    return value < 10
})
console.log(result)       // false, 表示该数组中有某个元素不小于10

16、some()
some()方法跟every()方法类似，只是逻辑判断略有不同，前者是当每个元素调用回调函数后的返回值中，只要有一个为true，则最终返回true；反之，只有当每个元素调用回调函数后的返回值全部都为false时，最后才返回false

var arr = [3, 8, 9, 45, 12]

var result = arr.some(function (value) {
    return value === 12
})
console.log(result)      // true, 表示该数组中有元素12

17、reduce()
reduce()方法是通过调用指定的回调函数将数组元素进行组合，并返回组合后的值（不会改变原数组）

参数（共2个）：

1. 第一个参数：为回调函数，用于处理数组元素。该回调函数有两个参数x、y，这两个参数都为调用数组的元素成员
2. 第二个参数：为可选参数，作为传递给回调函数的初始值。若省略该参数，则将数组的第一个数作为初初始值

var arr = [1,2,3,4,5,6]

var result = arr.reduce(function (x, y) {
    return x * y
}, 10)
console.log(result)          // 7200

19、indexOf()
indexOf()方法是获取某元素在数组中的索引，并且只返回第一个匹配到的元素的索引；若该元素不在数组中，则返回 -1（不会改变原数组）

参数（共2个）：

1. 第一个参数：必填，为需要查询的元素
2. 第二个参数：为可选参数，表示从数组的哪个位置开始搜索

var arr = ['张三', '小红', '小明', '张三', '李四', '王五']

//给indexOf()方法的第二个参数赋值1，表示从数组的第二个元素开始找
var index = arr.indexOf('张三', 1);
console.log(index)          // 3

21、find()
find() 方法是ES6新增的，它是遍历数组，找出并返回第一个符合回调函数的元素（可以通过回调函数的某些参数对原数组进行改动）

该方法只有一个参数，该参数为回调函数，该回调函数有三个参数，它们的含义分别为：数组元素 、元素的索引 、数组本身

该方法是遍历数组的每一个元素，并依次调用回调函数，回调函数最先返回true的元素作为最终的返回值

var arr = [1, 7, 3, 10, 12, 20]

var result = arr.find(function (value) {
    return value > 10
})
console.log(result)   // 12, 表示数组中找到的第一个比10大的元素为12

22、findIndex()
findIndex()方法也是ES6新增的方法，它是遍历数组，找出第一个符合回调函数的元素的索引（不会改变原数组）

var result = [3, 4, 10, 8, 9, 0].findIndex(function (value) {
    return value > 9
})
console.log(result)   // 2，表示该数组中第一个大于9的元素索引为2

23、fill()
fill()方法是ES6新增方法，它是用于填充数组的（会改变原数组）

参数（共3个）：

1. 第一个参数：表示用于填充数组的值
2. 第二个参数：可选参数，表示填充的起始位置
3. 第三个参数：可选参数，表示填充的结束位置，若省略该参数并且填写了第二个参数，则表示从起始位置开始一直到末尾的所有元素都被填充

[1,2,3,4,5].fill(6)         //返回 [6, 6, 6, 6, 6]

[1,2,3,4,5].fill(6, 2)      //返回 [1, 2, 6, 6, 6]

[1,2,3,4,5].fill(6, 2, 3)   //返回 [1, 2, 6, 4, 5]

24、includes()
includes()方法也是ES6新增的非常实用的一个方法，它是判断一个数是否在该数组中的（不会改变原数组）

参数（共2个）：

1. 第一个参数：该参数为需要判断是否存在于数组中的数
2. 第二个参数：表示搜索的起始位置，默认为0，即从头开始搜索。若为负数，则表示从倒数第几个开始搜索，若输入的位置超出了数组长度，则默认还是为0

var arr = ['chery', 'banana', 'apple', 'watermelon']

var result = arr.includes('banana', -2) //表示从倒数第二个开始找
console.log(result) //false, 表示从倒数第二个开始找，没有找到banana