前端/移动开发面试题更新 2026-08-05

请用JavaScript手写一个与原生Array.prototype.map行为一致的map函数,并给出完整代码实现。

前端/移动开发编码实现技术原理JavaScript

考察说明

考察对数组高阶函数map的底层实现原理理解,以及原型方法和回调函数机制的掌握。

回答思路

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