请用JavaScript手写一个与原生Array.prototype.map行为一致的map函数,并给出完整代码实现。
考察说明
考察对数组高阶函数map的底层实现原理理解,以及原型方法和回调函数机制的掌握。
回答思路
- 【回答框架 1】定义map方法的核心机制:遍历数组每个元素,调用回调函数,将返回值组成新数组返回,不修改原数组。
- 【回答框架 2】实现步骤:先判断调用者是否为数组,再判断回调是否为函数,然后创建结果数组,遍历原数组,用call或apply调用回调并传入当前值、索引和原数组,将结果存入新数组。
- 【回答框架 3】处理边界:支持稀疏数组(跳过空槽)、处理thisArg参数、保证返回值是新数组。
- 【回答框架 4】测试用例:可对比原生map处理普通数组、稀疏数组、带thisArg的情况。
- 【回答框架 5】代码模式:建议使用function声明,便于通过Array.prototype.map = myMap方式挂载。
- 【关键点 1】核心是遍历和回调调用,注意this指向和参数传递。
- 【关键点 2】返回新数组,不修改原数组。
- 【关键点 3】通过Object.prototype.toString或Array.isArray判断类型。
- 【关键点 4】实现简洁版后,可考虑稀疏数组和thisArg支持。
- 【易错点 1】不能直接使用forEach实现,因为forEach会跳过稀疏数组的空槽,而原生map会保留空槽。
- 【易错点 2】回调函数的this指向需通过thisArg参数传递,否则默认指向undefined(严格模式)或全局对象。
- 【易错点 3】避免使用箭头函数定义myMap,因为箭头函数没有自己的this,无法访问调用数组。