数组方法的迭代和操作：遍历和修改元素

对于 JavaScript 的数组来说，有很多实用的方法，不论是在遍历数组上，还是在操作数组内元素上。关于遍历数组的方法，有很多不同的选择，并且还有很多方法可以让你直接操作数组中的元素。

遍历数组

forEach()

forEach() 方法用于遍历数组中的每个元素。它接受一个回调函数作为参数，该函数将在数组的每个元素上执行。以下是 forEach() 方法的语法：

array.forEach(callback(currentValue, index, array))

callback 函数有三个参数：

• currentValue：当前元素的值
• index：当前元素的索引
• array：数组本身

例如：

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

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

输出：

Element at index 0 is 1
Element at index 1 is 2
Element at index 2 is 3
Element at index 3 is 4
Element at index 4 is 5

map()

map() 方法创建一个新数组，其中包含对原数组中每个元素应用指定函数后的结果。以下是 map() 方法的语法：

array.map(callback(currentValue, index, array))

callback 函数具有与 forEach() 方法相同的三个参数。

例如：

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

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

doubledNumbers 数组将包含以下元素：

[2, 4, 6, 8, 10]

filter()

filter() 方法创建一个新数组，其中包含通过指定函数测试的原数组中的所有元素。以下是 filter() 方法的语法：

array.filter(callback(currentValue, index, array))

callback 函数具有与 forEach() 和 map() 方法相同的三个参数。

例如：

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

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

evenNumbers 数组将包含以下元素：

[2, 4]

find()

find() 方法返回原数组中第一个通过指定函数测试的元素。以下是 find() 方法的语法：

array.find(callback(currentValue, index, array))

callback 函数具有与 forEach()、map() 和 filter() 方法相同的三个参数。

例如：

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

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

firstEvenNumber 将等于 2。

findIndex()

findIndex() 方法返回原数组中第一个通过指定函数测试的元素的索引。以下是 findIndex() 方法的语法：

array.findIndex(callback(currentValue, index, array))

callback 函数具有与 forEach()、map()、filter() 和 find() 方法相同的三个参数。

例如：

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

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

indexOfFirstEvenNumber 将等于 1。

操作数组

push()

push() 方法向数组的末尾添加一个或多个元素。以下是 push() 方法的语法：

array.push(element1, element2, ..., elementN)

element1、element2、...、elementN 是要添加到数组中的元素。

例如：

const numbers = [1, 2, 3];

numbers.push(4, 5);

numbers 数组现在包含以下元素：

[1, 2, 3, 4, 5]

pop()

pop() 方法删除数组末尾的最后一个元素并返回该元素。以下是 pop() 方法的语法：

array.pop()

例如：

const numbers = [1, 2, 3];

const lastElement = numbers.pop();

lastElement 将等于 3，而 numbers 数组现在包含以下元素：

[1, 2]

shift()

shift() 方法删除数组开头处的第一个元素并返回该元素。以下是 shift() 方法的语法：

array.shift()

例如：

const numbers = [1, 2, 3];

const firstElement = numbers.shift();

firstElement 将等于 1，而 numbers 数组现在包含以下元素：

[2, 3]

unshift()

unshift() 方法向数组开头处添加一个或多个元素。以下是 unshift() 方法的语法：

array.unshift(element1, element2, ..., elementN)

element1、element2、...、elementN 是要添加到数组中的元素。

例如：

const numbers = [1, 2, 3];

numbers.unshift(0);

numbers 数组现在包含以下元素：

[0, 1, 2, 3]

结论

这些只是 JavaScript 数组方法中的一小部分。通过了解和使用这些方法，你可以高效地遍历和操作数组，这对于任何 JavaScript 开发人员来说都是一项有价值的技能。