滨州双创网络

ES6中的`map`方法是用于操作数组的高阶函数之一，它允许你创建一个新数组，该数组的每个元素都是原始数组中的元素经过指定函数处理后的结果。`map`方法不会修改原始数组，而是返回一个新数组，该数组的长度和原始数组相同。

本文文章目录

• 返回值 `map`方法返回一个新数组，该数组包含了原始数组中每个元素经过`callback`函数处理后的结果。
• 使用示例
• 总结

以下是`map`方法的详细介绍：

javascript
array.map(callback(currentValue[, index[, array]])[, thisArg])

- `array`：要操作的原始数组。 - `callback`：对每个元素调用的函数，接受以下参数： - `currentValue`：当前处理的元素。 - `index`（可选）：当前元素的索引。 - `array`（可选）：原始数组。 - `thisArg`（可选）：用于在`callback`函数中作为`this`关键字的值。

返回值 `map`方法返回一个新数组，该数组包含了原始数组中每个元素经过`callback`函数处理后的结果。

使用示例

#### 1. 将数组中的每个元素加倍

const numbers = [1, 2, 3, 4, 5];
const doubledNumbers = numbers.map(function (num) {
  return num * 2;
});console.log(doubledNumbers); // 输出 [2, 4, 6, 8, 10]

#### 2. 使用箭头函数简化示例

const numbers = [1, 2, 3, 4, 5];
const doubledNumbers = numbers.map((num) => num * 2);console.log(doubledNumbers); // 输出 [2, 4, 6, 8, 10]

#### 3. 转换字符串数组为大写

const words = ['hello', 'world', ''];
const capitalizedWords = words.map(function (word) {
  return word.toUpperCase();
});console.log(capitalizedWords); // 输出 ['HELLO', 'WORLD', 'JAVASCRIPT']

#### 4. 在`map`方法中使用`thisArg`

const numbers = [1, 2, 3, 4, 5];
const multiplier = 2;const doubledNumbers = numbers.map(function (num) {
  return num * this.multiplier;
}, { multiplier });console.log(doubledNumbers); // 输出 [2, 4, 6, 8, 10]

总结：

### 注意事项 - `map`方法不会修改原始数组，而是返回一个新数组。 - `callback`函数中的操作不会影响原始数组。 - 如果`thisArg`参数提供了一个值，它将在`callback`函数中作为`this`关键字使用。 - `map`方法对原始数组的每个元素依次调用`callback`函数，并将结果收集到新数组中。 - `map`方法是一个纯函数，它不会改变原始数组，因此在函数式编程中非常有用。