📜  JavaScript Array map()方法(1)

📅  最后修改于: 2023-12-03 15:31:36.657000             🧑  作者: Mango

JavaScript Array map()方法

map()方法是Javascript数组原型(Array.prototype)中的一个内置函数。它的作用是调用数组中每个元素的回调函数,并且返回一个由原数组每个元素所调用回调函数后的返回值构成的新数组。

map()方法的语法如下:

array.map(callback[, thisArg])

其中,callback指的是一个回调函数,thisArg是可选的,是回调函数执行时this的值。

下面是map()方法的一个使用示例,它将一个数组中所有元素都乘以2并返回一个新数组:

const arr = [1, 2, 3];
const newArr = arr.map((value) => {
    return value * 2;
});
console.log(newArr); // [2, 4, 6]

在这个例子中,map()方法首先在arr数组中循环遍历每个元素,并将每个元素传递给回调函数(value) => { return value * 2; }。回调函数执行后返回新数组中对应的元素,最终返回一个由返回值组成的新数组newArr

在使用map()方法时,回调函数还可以接收三个参数:

  • value:当前遍历到的元素。
  • index:当前元素的索引。
  • array:原始数组。

回调函数中亦可传递上述参数中的任意一个或所有参数。

下面是一个使用map()函数返回数组每个元素的索引的示例:

const arr = ["apple", "orange", "banana"];
const newArr = arr.map((value, index) => {
    return index;
});
console.log(newArr); // [0, 1, 2]

在这个示例中,回调函数返回当前元素的索引,新数组中的元素由返回值组成。

最后,我们应该注意到map()方法不会影响原始数组中的元素。如果我们想要改变原数组中的元素,我们应该使用forEach()for..in循环。以下是一个修改数组中元素值的示例:

const arr = [1, 2, 3, 4, 5, 6];
arr.forEach((value, index, array) => {
    array[index] = value * 2;
});
console.log(arr); // [2, 4, 6, 8, 10, 12]

在这个示例中,我们使用forEach()方法,遍历数组并将数组中的每个元素乘以2。由于我们直接修改了原始数组arr,所以最终我们得到的是修改后的原数组arr

总结

map()方法是Javascript中常用的遍历数组的方法之一。它返回一个新的数组,新数组中的每个元素由原数组中的元素通过回调函数的返回值构成。同时,回调函数中可接受当前遍历到的元素、当前元素索引以及原数组作为参数,以便更加灵活的操作和处理数组。