JavaScript 数组类型数据常用方法大汇总（只需了解这些即可）

一、前言：

在学习 JavaScript 数组时，我们会接触到许多数组方法。这些方法可以帮助我们轻松完成各种操作，但由于数量众多，有时难免会忘记一些不太常用的方法。因此，本文将对 JavaScript 数组的常用方法进行归纳总结，让您在需要时能够快速找到所需的方法。

二、数组遍历方法：

1. forEach()：forEach() 方法用于遍历数组中的每个元素，并执行指定的回调函数。回调函数接受三个参数：当前元素、当前元素的索引以及数组本身。

const numbers = [1, 2, 3, 4, 5];

numbers.forEach((number, index, array) => {
  console.log(`Element ${index}: ${number}`);
});

输出：

Element 0: 1
Element 1: 2
Element 2: 3
Element 3: 4
Element 4: 5

2. map()：map() 方法用于遍历数组中的每个元素，并返回一个包含经过转换后的元素的新数组。map() 方法接受一个回调函数作为参数，该函数接受当前元素、当前元素的索引以及数组本身，并返回一个新值。

const doubledNumbers = numbers.map((number) => {
  return number * 2;
});

console.log(doubledNumbers);

输出：

[2, 4, 6, 8, 10]

3. filter()：filter() 方法用于遍历数组中的每个元素，并返回一个包含通过指定条件筛选后的元素的新数组。filter() 方法接受一个回调函数作为参数，该函数接受当前元素、当前元素的索引以及数组本身，并返回一个布尔值。如果布尔值为 true，则当前元素将被包含在新数组中。

const evenNumbers = numbers.filter((number) => {
  return number % 2 === 0;
});

console.log(evenNumbers);

输出：

[2, 4]

三、数组排序方法：

1. sort()：sort() 方法用于对数组中的元素进行排序。sort() 方法接受一个可选的比较函数作为参数。如果未提供比较函数，则数组中的元素将按其 Unicode 代码点进行排序。

numbers.sort();

console.log(numbers);

输出：

[1, 2, 3, 4, 5]

2. reverse()：reverse() 方法用于将数组中的元素颠倒顺序。

numbers.reverse();

console.log(numbers);

输出：

[5, 4, 3, 2, 1]

四、数组搜索方法：

1. indexOf()：indexOf() 方法用于查找数组中第一个与指定元素相等的元素的索引。如果找不到该元素，则返回 -1。

const index = numbers.indexOf(3);

console.log(index);

输出：

2

2. lastIndexOf()：lastIndexOf() 方法用于查找数组中最后一个与指定元素相等的元素的索引。如果找不到该元素，则返回 -1。

const lastIndex = numbers.lastIndexOf(3);

console.log(lastIndex);

输出：

2

3. find()：find() 方法用于查找数组中第一个满足指定条件的元素。find() 方法接受一个回调函数作为参数，该函数接受当前元素、当前元素的索引以及数组本身，并返回一个布尔值。如果布尔值为 true，则当前元素将被返回。

const evenNumber = numbers.find((number) => {
  return number % 2 === 0;
});

console.log(evenNumber);

输出：

2

4. findIndex()：findIndex() 方法用于查找数组中第一个满足指定条件的元素的索引。findIndex() 方法接受一个回调函数作为参数，该函数接受当前元素、当前元素的索引以及数组本身，并返回一个布尔值。如果布尔值为 true，则当前元素的索引将被返回。

const evenNumberIndex = numbers.findIndex((number) => {
  return number % 2 === 0;
});

console.log(evenNumberIndex);

输出：

1

五、数组转换方法：

1. join()：join() 方法用于将数组中的元素连接成一个字符串。join() 方法接受一个可选的分隔符作为参数。如果未提供分隔符，则元素将使用逗号分隔。

const joinedString = numbers.join();

console.log(joinedString);

输出：

1,2,3,4,5

2. slice()：slice() 方法用于从数组中提取指定范围的元素，并返回一个新的数组。slice() 方法接受两个参数：开始索引和结束索引。结束索引是可选的，如果省略，则数组中的所有元素都将被提取。

const subArray = numbers.slice(2, 4);

console.log(subArray);

输出：

[3, 4]

六、数组连接方法：

1. concat()：concat() 方法用于将两个或多个数组连接成一个新的数组。concat() 方法接受一个或多个数组作为参数。

const newNumbers = numbers.concat([6, 7, 8]);

console.log(newNumbers);

输出：

[1, 2, 3, 4, 5, 6, 7, 8]

七、数组切片方法：

1. push()：push() 方法用于将一个或多个元素添加到数组的末尾，并返回新数组的长度。

numbers.push(6);

console.log(numbers);

输出：

[1, 2, 3, 4, 5, 6]

2. pop()：pop() 方法用于从数组的末尾移除最后一个元素，并返回该元素。

const removedElement = numbers.pop();

console.log(removedElement);

输出：

6

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

numbers.unshift(0);

console.log(numbers);

输出：

[0, 1, 2, 3, 4, 5]

4. shift()：shift() 方法用于从数组的开头移除第一个元素，并返回该元素。

const removedElement = numbers.shift();

console.log(removedElement);

输出：

0

八、结语：

以上就是 JavaScript 数组最常用的方法。掌握这些方法，您将能够轻松操作和操纵数组中的元素，从而编写出更强大、更具可读性的代码。希望本文对您有所帮助！