JavaScript 数组高阶函数 map 详解

一、map 是什么？

map 是 JavaScript 数组的高阶函数（接收函数作为参数的函数），核心作用是：遍历数组的每一个元素，对每个元素执行指定的处理函数，最后返回一个「新数组」，新数组的元素是原数组元素处理后的结果。

简单说：map 就是「数组的批量加工器」，不改变原数组，只返回加工后的新数组。

二、基本语法

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

参数	描述
function(currentValue, index, arr)	必须。函数，数组中的每个元素都会执行这个函数
currentValue	必须。当前元素的值
index	可选。当前元素的索引值
arr	可选。当前元素属于的数组对象
thisValue	可选。对象作为该执行回调时使用，传递给函数，用作 "this" 的值。如果省略了 thisValue，或者传入 null、undefined，那么回调函数的 this 为全局对象。

返回值：返回一个新数组，数组中的元素为原始数组元素调用函数处理后的值。

常用写法：

// 普通函数写法
原数组.map(function(当前元素，索引，原数组) {
    // 对当前元素的处理逻辑
    return 处理后的结果; // 必须有 return，否则新数组元素为 undefined
}, 可选的 this 指向);

// 箭头函数写法（简洁，推荐）
原数组.map((item, index, arr) => {
    return 处理后的结果;
});

// 若处理逻辑只有一行，可省略大括号和 return（箭头函数简写）
原数组.map(item => 处理后的结果);

参数说明（前 3 个是处理函数的参数，最常用前 2 个）

1. item（必选）：当前正在遍历的数组元素；
2. index（可选）：当前元素的索引（从 0 开始）；
3. arr（可选）：调用 map 的原数组本身；
4. 可选的 this 指向（极少用）：指定处理函数内部 的指向（箭头函数不绑定 this，此参数对箭头函数无效）。