一总结表

二.会改变原数组的方法

1.copyWithin方法

定义：copyWithin() 方法用于从数组的指定位置拷贝元素到数组的另一个指定位置中。

兼容性：ES6

语法：array.copyWithin(target, start, end)

参数：

返回值：拷贝后的数组

示例：

let arr=[0,1,2,3,4,5];
//从arr的第四个元素开始，替换为其索引值从1到3的元素，超出的元素将被省略
console.log(arr.copyWithin(4, 1, 3));//[ 0, 1, 2, 3, 1, 2 ]

let arr1=[0,1,2,3,4,5];
//将第一个到倒数第三个元素拷贝，放到以索引为2开始的位置
console.log(arr1.copyWithin(2, 0, -3));//[ 0, 1, 0, 1, 2, 5 ]

2.fill方法

定义：fill() 方法用于将一个固定值替换数组的元素。

兼容性：ES6

语法：array.fill(value, start, end)

参数：

返回值：填充后的数组

示例：

let arr=[0,1,2,3,4,5];
//将数组arr的全部元素以998进行填充
console.log(arr.fill(998));//[ 998, 998, 998, 998, 998, 998 ]

let arr1=[0,1,2,3,4,5];
//将数组arr1中的第一个到倒数第三个元素以998进行填充
console.log(arr1.fill(998, 0, -3));//[ 998, 998, 998, 3, 4, 5 ]

3.pop方法

定义：pop() 方法用于删除数组的最后一个元素。

兼容性：无

语法：array.pop()

返回值：被删除的元素

示例：

let arr=[0,1,2,3,4,5];
//删除arr的最后一个元素
console.log(arr.pop());//5

4.push方法

定义：push() 方法可向数组的末尾添加一个或多个元素。

兼容性：无

语法：array.push(item1, item2, ..., itemX)

参数：

返回值：新的数组长度

示例：

let arr=[0,1,2,3,4,5];
//向arr末尾追加元素6
console.log(arr.push(6));//7
//向arr末尾追加元素7,8,9
console.log(arr.push(7,8,9));//10

5.reverse方法

定义：reverse() 方法用于颠倒数组中元素的顺序。

兼容性：无

语法：array.reverse()

返回值：颠倒顺序后的数组

示例：

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

6.shift方法

定义：shift() 方法用于把数组的第一个元素从其中删除。

兼容性：无

语法：array.shift()

返回值：被删除的元素

示例：

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

7.sort方法

定义：sort() 方法用于对数组的元素进行排序。排序顺序可以是字母或数字，并按升序或降序。默认排序顺序为按字母升序。

兼容性：无

语法：array.sort(sortfunction)

参数：

返回值：排序后的数组

示例：

let arr = ['#', 'b', 'f', 'a'];
console.log(arr.sort());//[ '#', 'a', 'b', 'f' ]

let arr1 = [9, 3, 5, 1, 8, 45, 23];
//升序排序
console.log(arr1.sort(function (a, b) {
    return a - b;//升序
}));//[ 1, 3, 5, 8, 9, 23, 45 ]

let arr2 = [9, 3, 5, 1, 8, 45, 23];
//降序排序
console.log(arr1.sort(function (a, b) {
    return b - a;//降序
}));//[ 45, 23, 9, 8, 5, 3, 1 ]

8.unshift方法

定义：unshift() 方法可向数组的开头添加一个或更多元素。

兼容性：无

语法：array.unshift(item1, item2, ..., itemX)

参数：

返回值：新数组的长度

示例：

let arr = [0, 1, 2, 3, 4, 5];
console.log(arr.unshift(10, 11));//8

9.splice方法

定义：splice() 方法用于添加或删除数组中的元素。

兼容性：无

语法：array.splice(index,howmany,item1,.....,itemX)

参数：

返回值：如果从array中删除了元素，则返回的是含有被删除的元素的数组，未删除元素时返回空数组。

示例：

let arr1=[0,1,2,3,4,5];
//删除从索引值为3到数组末尾的元素
console.log(arr1.splice(3));//[ 3, 4, 5 ]
console.log(arr1);//[ 0, 1, 2 ]

let arr2=[0,1,2,3,4,5];
//从索引值为3开始删除一个元素
console.log(arr2.splice(3,1));//[ 3 ]
console.log(arr2);//[ 0, 1, 2, 4, 5 ]

let arr3=[0,1,2,3,4,5];
//从索引值为3开始删除一个元素，并在此位置添加6,7,8
console.log(arr3.splice(3,1,6,7,8));//[ 3 ]
console.log(arr3);//[ 0, 1, 2, 6, 7, 8, 4, 5 ]

let arr4=[0,1,2,3,4,5];
//从索引值为3开始添加6,7,8
console.log(arr4.splice(3,0,6,7,8));//[]
console.log(arr4);//[ 0, 1, 2, 6, 7, 8, 3, 4, 5 ]

三.不会改变原数组的方法

1.concat方法

定义：concat() 方法用于连接两个或多个数组。

兼容性：无

语法：array1.concat(array2,array3,...,arrayX)

参数：

返回值：连接操作后的数组

示例：

let arr1=[1,2,3];
let arr2=[4,5,6];
let arr3=[7,8,9];
//将数组arr2和arr3与arr1连接
let res=arr1.concat(arr2,arr3);
console.log(res);//[ 1, 2, 3, 4, 5, 6, 7, 8, 9 ]

2.every方法

定义：every() 方法用于检测数组所有元素是否都符合指定条件（通过函数提供）。

兼容性：无

语法：array.every(function(currentValue,index,arr), thisValue)

参数：

返回值：如果数组中检测到有一个元素不满足，则整个表达式返回 false ，且剩余的元素不会再进行检测。如果所有元素都满足条件，则返回 true。

示例：

let arr=[0,1,2,3,4,5];
let thisValue={
    a:'every方法第一个参数函数的this指向'
}

//判断arr中的元素是否都大于-1
let count1=0;
console.log(arr.every(function (item, index, arr) {
    count1++;
    return item > -1;
}, thisValue));//true
console.log(count1)//6

//当条件出现不满足时，剩余的元素不再遍历
//判断arr中的元素是否都小于3
let count2=0;
console.log(arr.every(function (item, index, arr) {
    count2++;
    return item <3;
}, thisValue));//false
console.log(count2);//4

3.some方法

定义：some() 方法用于检测数组中的元素是否满足指定条件（函数提供）。

兼容性：无

语法：array.some(function(currentValue,index,arr), thisValue)

参数：

返回值：如果有一个元素满足条件，则表达式返回true , 剩余的元素不会再执行检测。如果没有满足条件的元素，则返回false。

示例：

let arr=[0,1,2,3,4,5];
let thisValue={
    a:'some方法第一个参数函数的this指向'
}

//判断arr中是否有大于等于1的元素
let count1=0;
console.log(arr.some(function (item, index, arr) {
    count1++;
    return item >= 1;//如果有一个元素满足条件，则表达式返回true,剩余的元素不会再执行检测
}, thisValue));//true
console.log(count1);//2

//判断arr中是否有大于5的元素
let count2=0;
console.log(arr.some(function (item, index, arr) {
    count2++;
    return item > 5;
}, thisValue));//false
console.log(count2);//6

4.filter方法

定义：filter() 方法创建一个新的数组，新数组中的元素是通过检查指定数组中符合条件的所有元素。

兼容性：无

语法：array.filter(function(currentValue,index,arr), thisValue)

参数：

返回值：返回数组，包含了符合条件的所有元素。如果没有符合条件的元素则返回空数组。

示例：

let arr=[0,1,2,3,4,5];
let thisValue={
    a:'filter方法第一个参数函数的this指向'
}
//将arr中小于等于2的元素过滤掉
let res=arr.filter(function(item,index,arr){
    return item>2;
},thisValue);
console.log(res);//[ 3, 4, 5 ]

5.find方法

定义：find() 方法返回通过测试（函数内判断）的数组的第一个元素的值。

兼容性：ES6

语法：array.find(function(currentValue,index,arr), thisValue)

参数：

返回值：当数组中的元素在测试条件时返回 true 时, find() 返回符合条件的元素，之后的值不会再调用执行函数。如果没有符合条件的则返回 undefined。

示例：

let arr=[0,1,2,3,4,5];
let thisValue={
    a:'find方法第一个参数函数的this指向'
}

//找出arr中第一个大于2的元素
let count1=0;
console.log(arr.find(function (item, index, arr) {
    count1++;
    return item > 2;//当条件满足时，剩余的元素不再遍历
}, thisValue));//3
console.log(count1);//4

//找出arr中第一个大于5的元素
let count2=0;
console.log(arr.find(function (item, index, arr) {
    count2++;
    return item > 5;
}, thisValue));//undefined
console.log(count2);//6

6.findIndex方法

定义：findIndex() 方法返回传入一个测试条件（函数）符合条件的数组第一个元素位置。

兼容性：ES6

语法：array.findIndex(function(currentValue,index,arr), thisValue)

参数：

返回值：当数组中的元素在测试条件时返回 true 时, findIndex() 返回符合条件的元素的索引位置，之后的值不会再调用执行函数。如果没有符合条件的则返回 -1。

示例：

let arr=[0,1,2,3,4,5];
let thisValue={
    a:'findIndex方法第一个参数函数的this指向'
}

//寻找arr中大于5的元素的索引
let count1=0;
console.log(arr.findIndex(function (item, index, arr) {
    count1++;
    return item > 5;//当条件满足时，剩余的元素不再遍历
}, thisValue));//-1
console.log(count1);//6

//寻找arr中大于3的元素的索引
let count2=0;
console.log(arr.findIndex(function (item, index, arr) {
    count2++;
    return item > 3;
}, thisValue));//4
console.log(count2);//5

7.forEach方法

定义：forEach() 方法用于调用数组的每个元素，并将元素传递给回调函数。

兼容性：无

语法：array.forEach(function(currentValue, index, arr), thisValue)

参数：

返回值： undefined。

示例：

let arr=[0,1,2,3,4,5];
let thisValue={
    a:'forEach方法第一个参数函数的this指向'
}
arr.forEach(function(item,index,arr){
    if(item===2){
        return;//利用return来实现continue，无法实现break(可以用every方法代替forEach实现break)
    }
    console.log(item);
},thisValue);
// 0
// 1
// 3
// 4
// 5

8.from方法

定义：from() 方法用于通过拥有 length 属性的对象或可迭代的对象来返回一个数组。

兼容性：ES6

语法：Array.from(object, mapFunction, thisValue)

参数：

返回值： undefined。

示例：

let thisValue = {
    a: 'form方法第二个参数函数的this指向'
}

//将str字符串转为数组，空格以“空值”文字代替
let str = 'this is string';
let strToArray = Array.from(str, function (item, index) {//这个函数只有两个参数，分别是元素值和索引
    if (item === ' ') {//可以利用返回值改变当前元素的值
        return '空值';
    } else {
        return item;
    }
}, thisValue);
console.log(strToArray);//[ 't', 'h', 'i', 's', '空值', 'i', 's', '空值', 's', 't', 'r', 'i', 'n', 'g' ]

//利用from和Set实现数组去重
let res = Array.from(new Set([1, 2, 3, 1, 5, 1, 10]));
console.log(res);//[ 1, 2, 3, 5, 10 ]

9.includes方法

定义：includes() 方法用来判断一个数组是否包含一个指定的值。

兼容性：ES6

语法：arr.includes(searchElement, fromIndex)

参数：

返回值： 布尔值。如果找到指定值返回 true，否则返回 false。

示例：

//从第一个元素开始查找元素10
console.log(arr.includes(10));//false
//从第一个元素开始查找元素4
console.log(arr.includes(4));//true
//从倒数第六个元素开始查找4
console.log(arr.includes(4, -6));//true
//从倒数第五个元素开始查找4
console.log(arr.includes(4, -5));//false

10.indexOf方法

定义：indexOf() 方法可返回数组中某个指定的元素第一次出现的位置。

兼容性：无

语法：array.indexOf(item,start)

参数：

返回值： 元素在数组中的位置，如果没有搜索到则返回 -1。

示例：

let arr=['a','b','c','d','e'];
//从第一个元素开始查找字符c
console.log(arr.indexOf('c'));//2
//从第一个元素开始查找字符f
console.log(arr.indexOf('f'));//-1
//从索引为2的元素开始查找字符c
console.log(arr.indexOf('c',2));//2
//从索引为3的元素开始查找字符c
console.log(arr.indexOf('c',3));//-1
//从倒数第四个元素开始查找字符c
console.log(arr.indexOf('c',-4));//2

11.lastIndexOf方法

定义：lastIndexOf() 方法可返回数组中某个指定的元素最后一次出现的位置。其用法与indexOf一致。

12.isArray方法

定义：isArray() 方法用于判断一个对象是否为数组。

兼容性：ES5

语法：Array.isArray(obj)

参数：

返回值：布尔值，如果对象是数组返回 true，否则返回 false。

示例：

let arr=[1,2,3,4];
let number=1;
let str='string';
let set=new Set([1,23,34,43]);//Set { 1, 23, 34, 43 }
let map=new Map([
    ['apples', 500],
    ['bananas', 300],
    ['oranges', 200]
]);//Map { 'apples' => 500, 'bananas' => 300, 'oranges' => 200 }

console.log(Array.isArray(arr));//true
console.log(Array.isArray(number));//false
console.log(Array.isArray(str));//false
console.log(Array.isArray(set));//false
console.log(Array.isArray(map));//false

13.join方法

定义：join() 方法用于把数组中的所有元素转换一个字符串。

兼容性：无

语法：array.join(separator)

参数：

返回值：返回一个字符串。该字符串是通过把 arrayObject 的每个元素转换为字符串，然后把这些字符串连接起来，在两个元素之间插入 separator 字符串而生成的。

示例：

let arr= ["a", "b", "c", "d"];
let res1 = arr.join();
let res2 = arr.join('-');
console.log(res1);//a,b,c,d
console.log(res2);//a-b-c-d

14.keys方法

定义：keys() 方法用于从数组创建一个包含数组键的可迭代对象。

兼容性：ES6

语法：array.keys()

参数：无

返回值： 一个数组可迭代对象。

示例：

let arr=['a','b','c','d'];
let iterator1=arr.keys();
for (const key of iterator1) {
    console.log(key);
}
// 0
// 1
// 2
// 3

arr[10]='j';
console.log(arr);//[ 'a', 'b', 'c', 'd', <6 empty items>, 'j' ]
let iterator2=arr.keys();
for (const key of iterator2) {
    console.log(key);
}
// 0
// 1
// 2
// 3
// 4
// 5
// 6
// 7
// 8
// 9
// 10

15.map方法

定义：map() 方法返回一个新数组，数组中的元素为原始数组元素调用函数处理后的值。map() 方法按照原始数组元素顺序依次处理元素。

兼容性：无

语法：array.map(function(currentValue,index,arr), thisValue)

参数：

返回值：返回一个新数组，数组中的元素为原始数组元素调用函数处理后的值。

示例：

let arr=[0,1,2,3,4,5];
let thisValue={
    a:'map方法第一个参数函数的this指向'
}
//将arr的每个元素+1
let res=arr.map(function (item,index,arr) {
    return item+1;//返回值将作为新数组的元素
},thisValue);
console.log(res);//[ 1, 2, 3, 4, 5, 6 ]

16.reduce方法

定义：reduce() 方法接收一个函数作为累加器，数组中的每个值（从左到右）开始缩减，最终计算为一个值。

兼容性：无

语法：array.reduce(function(total, currentValue, currentIndex, arr), initialValue)

参数：

返回值：返回计算结果

示例：

let arr=[0,1,2,3,4,5];

//未设置初始值，计算arr的和
console.log(arr.reduce(function (total, item, index, arr) {
    return total + item;
}));//15

//设置初始值为10，计算arr的和
console.log(arr.reduce(function (total, item, index, arr) {
    return total + item;
}, 10));//25

17.reduceRight方法

定义：reduceRight() 方法的功能和 reduce() 功能是一样的，不同的是 reduceRight() 从数组的末尾向前将数组中的数组项做累加。

18.slice方法

定义：slice() 方法可从已有的数组中返回选定的元素。slice() 方法可提取字符串的某个部分，并以新的字符串返回被提取的部分。

兼容性：无

语法：array.slice(start, end)

参数：

返回值：返回一个新的数组，包含从 start（包括该元素） 到 end （不包括该元素）的元素。

示例：

let arr=[0,1,2,3,4,5];
//不传参数时,可用于拷贝数组
let arr1=arr.slice();
console.log(arr1,arr1===arr);//[ 0, 1, 2, 3, 4, 5 ] false
//选取从索引值为3到最后一个的元素
console.log(arr.slice(3));// [ 3, 4, 5 ]
//选取从索引值为3到索引值为4的元素
console.log(arr.slice(3, 4));// [ 3 ]
//选取从倒数第二个元素到最后一个的元素
console.log(arr.slice(-2));// [ 4, 5 ]
//选取从倒数第二个元素到倒数第一个的元素
console.log(arr.slice(-3, -1));// [ 3, 4 ]

19.toString方法

定义：toString() 方法可把数组转换为字符串，并返回结果。

兼容性：无

语法：array.toString()

参数：无

返回值：数组的所有值用逗号隔开。

示例：

let arr=['#','b','f','a'];
console.log(arr.toString());//#,b,f,a

20.valueOf方法

定义：valueOf() 方法返回 Array 对象的原始值。

兼容性：无

语法：array.valueOf()

参数：无

返回值：array本身。

示例：

let arr=['#','b','f','a'];
let res=arr.valueOf();
console.log(res === arr);//true

参考文献：菜鸟教程JavaScript Array 对象