JS数组map

JS数组map

在JavaScript中，map()方法是一个非常常用的数组方法，它允许我们对数组中的每个元素进行操作并返回一个新的数组。在本文中，我们将详细讨论map()方法的用法及示例代码。

语法

map()方法的语法如下所示：

array.map(function(currentValue, index, arr), thisValue)

• function(currentValue, index, arr)：必须。用于定义要对数组中的每个元素执行的函数。该函数接受三个参数：currentValue为当前元素的值，index为当前元素的索引，arr为数组本身。
• thisValue：可选。对象作为该执行回调时使用的 this 值。如果省略该参数，则使用全局对象作为 this 值。

示例

接下来，让我们通过一些示例代码来帮助理解map()方法的使用。

示例1：将数组中的每个元素乘以2并返回新的数组

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

const newArr = arr.map(x => x * 2);

console.log(newArr);

结果输出：

[2, 4, 6, 8, 10]

在这个示例中，我们定义了一个数组arr，然后使用map()方法将数组中的每个元素乘以2，并将结果保存在newArr中。最终新数组的结果为[2, 4, 6, 8, 10]。

示例2：将字符串数组中的元素转换为大写

const strArr = ["hello", "world", "javascript"];

const upperCaseArr = strArr.map(str => str.toUpperCase());

console.log(upperCaseArr);

结果输出：

["HELLO", "WORLD", "JAVASCRIPT"]

在这个示例中，我们定义了一个字符串数组strArr，然后使用map()方法将数组中的每个元素转换为大写，并将结果保存在upperCaseArr中。最终新数组的结果为["HELLO", "WORLD", "JAVASCRIPT"]。

示例3：获取数组中每个元素的索引

const arr = ['a', 'b', 'c', 'd', 'e'];

const indexArr = arr.map((value, index) => index);

console.log(indexArr);

结果输出：

[0, 1, 2, 3, 4]

在这个示例中，我们定义了一个数组arr，然后使用map()方法获取数组中每个元素的索引，并将结果保存在indexArr中。最终新数组的结果为[0, 1, 2, 3, 4]。

总结

通过上面的示例，我们可以看到map()方法的强大之处。它允许我们对数组中的每个元素进行操作，并且能够很方便地返回一个新的数组。在实际开发中，map()方法常常用于数据转换、数据提取等操作，能够大大简化我们的代码逻辑。