JavaScript中数组常用的操作方法（最全整理！！！）

目录

1 isArray() 方法用于判断一个对象是否为数组

2  toString() 方法返回数组的字符串形式

3 join() 方法用于将数组中的所有元素连接成一个字符串

4 push() 方法用于在数组的末尾添加一个或多个元素，并返回新的长度

5 unshift() 方法用于在数组的开头添加一个或多个元素，并返回新的长度

6 pop() 方法用于删除数组的最后一个元素，并返回删除的元素

7 shift() 方法用于删除数组的第一个元素，并返回删除的元素

8 splice() 方法用于删除指定的元素, 返回结果是由删除的元素组成的数组

9 slice() 方法用于从数组中截取指定索引范围内的元素，返回结果是一个新的数组

10 concat() 方法用于连接两个或多个数组，返回结果是一个新的数组，不会改变原数组

11 fill() 方法用于将一个固定值替换数组的元素，返回结果是一个新的数组，会改变原数组

12 reverse() 方法用于将数组中的元素反转，返回结果是一个新的数组，会改变原数组

13 sort() 方法用于对数组的元素进行排序，返回结果是一个新的数组，会改变原数组

13.1 不带参

13.2 带参

14 forEach() 方法用于遍历数组，对数组的每个元素执行一次提供的函数, 不影响原数组

15  map() 方法用于创建一个新数组，新数组中的每个元素都是原数组中对应元素调用函数处理后的结果

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

17 find() 方法返回符合测试条件的第一个数组元素的值，如果没有符合条件的则返回undefined

18 findIndex() 方法返回符合测试条件的第一个元素索引位置

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

20 every() 方法用于检测数组中的所有元素是否都满足指定条件（函数提供）

21 reduce() 方法对数组中的所有元素进行累计运算

22 flat() 方法将嵌套数组扁平化

23 flatMap() 方法对数组中的每个元素应用给定的回调函数，然后将结果展开一级，返回一个新数组

24 indexOf() 方法用于返回数组中第一次出现给定元素的下标，如果不存在则返回 -1

25 lastIndexOf() 方法返回数组中给定元素最后一次出现的索引，如果不存在则返回 -1

---

1 isArray() 方法用于判断一个对象是否为数组

const arr = [1, 2, 3]
console.log(Array.isArray(arr)) // 输出: true
console.log(Array.isArray({})) // 输出: false
console.log(Array.isArray('abc')) // 输出: false
console.log(Array.isArray(null)) // 输出: false
console.log(Array.isArray(undefined)) // 输出: false
console.log(Array.isArray(123)) // 输出: false
console.log(Array.isArray(true)) // 输出: false

---

2  toString() 方法返回数组的字符串形式

const arr1 = [1, 2, 3]
console.log(arr1.toString()) // 输出: "1,2,3"
const arr2 = ['a', 'b', 'c']
console.log(arr2.toString()) // 输出: "a,b,c"

---

3 join() 方法用于将数组中的所有元素连接成一个字符串

const arr3 = [1, 2, 3]
console.log(arr3.join()) // 输出: "1,2,3"
console.log(arr3.join('-')) // 输出: "1-2-3"
console.log(arr3.join('')) // 输出: "123"
console.log(arr3.join(' ')) // 输出: "1 2 3"
console.log(arr3.join('')) // 输出: "123"

---

4 push() 方法用于在数组的末尾添加一个或多个元素，并返回新的长度

const arr4 = [1, 2, 3]
console.log(arr4.push(4)) // 输出: 4  -> 为数组的长度
console.log(arr4) // 输出: [1, 2, 3, 4]

---

5 unshift() 方法用于在数组的开头添加一个或多个元素，并返回新的长度

const arr5 = [1, 2, 3]
console.log(arr5.unshift(0)) // 输出: 4  -> 为数组的长度
console.log(arr5) // 输出: [0, 1, 2, 3]

---

6 pop() 方法用于删除数组的最后一个元素，并返回删除的元素

const arr6 = [1, 2, 3]
console.log(arr6.pop()) // 输出: 3
console.log(arr6) // 输出: [1, 2]

---

7 shift() 方法用于删除数组的第一个元素，并返回删除的元素

const arr7 = [1, 2, 3]
console.log(arr7.shift()) // 输出: 1
console.log(arr7) // 输出: [2, 3]

---

8 splice() 方法用于删除指定的元素, 返回结果是由删除的元素组成的数组

const arr8 = [1, 2, 3, 4, 5]
// 语法:  arr.splice(起始位置->索引号, 删除几个元素)
console.log(arr8.splice(2, 1)) // 输出: [3]
console.log(arr8) // 输出: [1, 2, 4, 5]

---

9 slice() 方法用于从数组中截取指定索引范围内的元素，返回结果是一个新的数组

const arr9 = [1, 2, 3, 4, 5]
// 语法：arr.slice(起始位置->索引号, 结束位置->索引号+1)  
// 注意：结束位置的索引号是不包含的，即结束位置的索引号对应的元素不会被截取到。
// 注意：如果省略第二个参数，则默认截取到数组的末尾。
// 注意：slice() 方法不会修改原数组，而是返回一个新的数组。
// 注意：slice() 方法可以接受负值作为参数，表示从后往前数的位置。
console.log(arr9.slice(1)) // 输出: [2, 3, 4, 5]
console.log(arr9.slice(2, 4)) // 输出: [3, 4]
console.log(arr9) // 输出: [1, 2, 3, 4, 5]

---

10 concat() 方法用于连接两个或多个数组，返回结果是一个新的数组，不会改变原数组

const arr10 = [1, 2, 3]
const arr11 = [4, 5]
console.log(arr10.concat(arr11)) // 输出: [1, 2, 3, 4, 5]
console.log(arr10) // 输出: [1, 2, 3]

---

11 fill() 方法用于将一个固定值替换数组的元素，返回结果是一个新的数组，会改变原数组

const arr12 = [1, 2, 3]
console.log(arr12.fill(4)) // 输出: [4, 4, 4]
console.log(arr12.fill('a'))  // 输出: [a, a, a]
console.log(arr12)  // 输出: ['a', 'a', 'a']

---

12 reverse() 方法用于将数组中的元素反转，返回结果是一个新的数组，会改变原数组

const arr13 = [1, 2, 3]
console.log(arr13.reverse()) // 输出: [3, 2, 1]
console.log(arr13) // 输出: [1, 2, 3]

---

13 sort() 方法用于对数组的元素进行排序，返回结果是一个新的数组，会改变原数组

13.1 不带参

// 1. 不带参，默认按照字符编码的顺序进行排序 
const arr14 = [3, 1, 2]
console.log(arr14.sort())  // 输出：[1, 2, 3]
const arr15 = ['banana', 'apple', 'orange']
console.log(arr15.sort())  // 输出: ['apple', 'banana', 'orange'];

13.2 带参

// 2. 携带参数
// 2.1 升序排序  参数1 > 参数2
const arr16 = [3, 1, 2]
console.log(arr16.sort((a, b) => a - b))  // 输出: [1, 2, 3]

// 2.2 降序排序  参数1 < 参数2
const arr17 = [3, 1, 2]
console.log(arr17.sort((a, b) => b - a))  // 输出: [3, 2, 1]

---

14 forEach() 方法用于遍历数组，对数组的每个元素执行一次提供的函数, 不影响原数组

const arr18 = [1, 2, 3]
arr18.forEach(function (value, index, array) {
       console.log(value, index, array)
})

---

15  map() 方法用于创建一个新数组，新数组中的每个元素都是原数组中对应元素调用函数处理后的结果

const arr19 = [1, 2, 3]
console.log(arr19.map((value, index) => value * 2))  // 输出: [2, 4, 6]

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

const arr20 = [1, 2, 3, 4, 5, 6]
console.log(arr20.filter((value, index) => value % 2 === 0))  // 输出: [2, 4, 6]

---

17 find() 方法返回符合测试条件的第一个数组元素的值，如果没有符合条件的则返回undefined

const arr21 = [1, 2, 3, 4, 5, 6]
console.log(arr21.find((value, index) => value > 3))  // 输出: 4
console.log(arr21.find((value, index) => value > 2))  // 输出: 3

---

18 findIndex() 方法返回符合测试条件的第一个元素索引位置

const arr22 = [1, 2, 3, 4, 5, 6]
console.log(arr22.findIndex((value, index) => value > 3))  // 输出: 3

---

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

测试数组中是否至少有一个元素通过了由提供的函数实现的测试。如果在数组中找到一个元素使得提供的函数返回 true，则返回 true；否则返回 false。它不会修改数组。

const arr23 = [1, 2, 3, 4, 5, 6]
console.log(arr23.some((value, index) => value > 3))  // 输出: true
console.log(arr23.some((value, index) => value > 7))  // 输出: false

---

20 every() 方法用于检测数组中的所有元素是否都满足指定条件（函数提供）

所有元素都满足才会返回true, 若有一个不满足条件，则返回false，后面的元素都不会再执行

const arr24 = [1, 2, 3, 4, 5, 6]
console.log(arr24.every((value, index) => value > 0))  // 输出: true
console.log(arr24.every((value, index) => value > 3))  // 输出: false

---

21 reduce() 方法对数组中的所有元素进行累计运算

第一次执行回调函数时，不存在“上一次的计算结果”。如果需要回调函数从数组索引为 0 的元素开始执行，则需要传递初始值。否则，数组索引为 0 的元素将被用作初始值，迭代器将从第二个元素开始执行（即从索引为 1 而不是 0 的位置开始）

const arr25 = [1, 2, 3, 4, 5, 6]
console.log(arr25.reduce((sum, currentValue) => sum + currentValue, 0))  // 0表示初始值， 可以根据需要更改
console.log(arr25.reduce((sum, currentValue) => sum + currentValue, 2))

---

22 flat() 方法将嵌套数组扁平化

flat() 方法创建一个新的数组，并根据指定深度递归地将所有子数组元素拼接到新的数组中

const arr26 = [0, 1, [2, [3, [4, 5]]]]
console.log(arr26.flat())  // 输出: [0, 1, 2, Array [3, Array [4, 5]]]
console.log(arr26.flat(2))  // 输出: [0, 1, 2, 3, Array [4, 5]]
console.log(arr2.flat(Infinity))   // 输出：Array [0, 1, 2, 3, 4, 5]

---

23 flatMap() 方法对数组中的每个元素应用给定的回调函数，然后将结果展开一级，返回一个新数组

它等价于在调用 map() 方法后再调用深度为 1 的 flat() 方法（arr.map(...args).flat()），但比分别调用这两个方法稍微更高效一些。

const arr27 = [1, 2, 3, 4, 5]
console.log(arr27.flatMap(value => value === 2 ? [2, 2] : 1))  // 输出: [1, 2, 2, 1, 1, 1]

---

24 indexOf() 方法用于返回数组中第一次出现给定元素的下标，如果不存在则返回 -1

const arr28 = [1, 2, 3, 4, 5]
// 语法：
// indexOf(searchElement)
// indexOf(searchElement, fromIndex)
console.log(arr28.indexOf(3))  // 输出: 2
console.log(arr28.indexOf(6))  // 输出: -1
console.log(arr28.indexOf(3, 2))  // 输出: 2
console.log(arr28.indexOf(3, 3))  // 输出: -1
console.log(arr28.indexOf(3, -1))  // 输出: -1

---

25 lastIndexOf() 方法返回数组中给定元素最后一次出现的索引，如果不存在则返回 -1

该方法从 fromIndex 开始向前（左）搜索数组。

const arr29 = [1, 2, 3, 4, 5, 3, 2, 1]
// 语法：
// lastIndexOf(searchElement)
// lastIndexOf(searchElement, fromIndex)
console.log(arr29.lastIndexOf(3))  // 输出: 5
console.log(arr29.lastIndexOf(6))  // 输出: -1
console.log(arr29.lastIndexOf(3, 2))  // 输出: 2
console.log(arr29.lastIndexOf(3, 3))  // 输出: 2
console.log(arr29.lastIndexOf(3, -1))  // 输出: 5

---