js forEach和 map 区别

Array.prototype.forEach()

forEach() 方法对数组的每个元素执行一次给定的函数。

forEach() 方法按升序为数组中含有效值的每一项执行一次 callbackFn 函数,那些已删除或者未初始化的项将被跳过(例如在稀疏数组上,见下方的示例)。

可依次向 callbackFn 函数传入三个参数:

数组当前项的值
数组当前项的索引
数组对象本身

具体参考官方文档

特点:

  • forEach() 遍历的范围在第一次调用 callbackFn 前就会确定。
  • 调用 forEach 后添加到数组中的项不会被 callbackFn 访问到。
  • 如果已经存在的值被改变,则传递给 callbackFn 的值是 forEach() 遍历到他们那一刻的值。
  • 已删除的项不会被遍历到。如果已访问的元素在迭代时被删除了(例如使用 shift()),之后的元素将被跳过
  • forEach() 为每个数组元素执行一次 callbackFn 函数;与 map() 或者 reduce() 不同的是,它总是返回 undefined 值,并且不可链式调用。其典型用例是在一个调用链的最后执行副作用(side effects,函数式编程上,指函数进行 返回结果值 以外的操作)。
  • 不对未初始化的值进行任何操作(稀疏数组)
  • 不可以阻止循环,只能用 new Error 来抛出循环
  • 原数组如果全是基本数据类型,不会改变原数组,如果是引用数据类型,会改变原数组

Array.prototype.map()

map() 方法创建一个新数组,这个新数组由原数组中的每个元素都调用一次提供的函数后的返回值组成。

具体见文档

map 方法会给原数组中的每个元素都按顺序调用一次 callbackFn 函数。callbackFn 每次执行后的返回值(包括 undefined)组合起来形成一个新数组。 callbackFn 函数只会在有值的索引上被调用;那些从来没被赋过值或者使用 delete 删除的索引则不会被调用。

因为 map 生成一个新数组,当你不打算使用返回的新数组却使用 map 是违背设计初衷的,请用 forEach 或者 for-of 替代。

如果有以下情形,则不该使用 map

  • 你不打算使用返回的新数组;或
  • 你没有从回调函数中返回值。

特点:

  • map 不修改调用它的原数组本身(当然可以在 callbackFn 执行时改变原数组), 原数组如果全是基本数据类型,不会改变原数组,如果是引用数据类型,会改变原数组
  • 不可以阻止循环,只能用 new Error 来抛出循环
  • map 方法处理数组元素的范围是在 callbackFn 方法第一次调用之前就已经确定了。调用 map 方法之后追加的数组元素不会被 callbackFn 访问。如果存在的数组元素改变了,那么传给 callbackFn 的值是 map 访问该元素时的值。在 map 函数调用后但在访问该元素前,该元素被删除的话,则无法被访问到。
  • 根据规范中定义的算法,如果被 map 调用的数组是离散的,新数组将也是离散的保持相同的索引为空。
  • map因为返回数组所以可以链式操作,forEach不能

 

posted @   蓓蕾心晴  阅读(121)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· 阿里最新开源QwQ-32B,效果媲美deepseek-r1满血版,部署成本又又又降低了!
· SQL Server 2025 AI相关能力初探
· AI编程工具终极对决:字节Trae VS Cursor,谁才是开发者新宠?
· 开源Multi-agent AI智能体框架aevatar.ai,欢迎大家贡献代码
· Manus重磅发布:全球首款通用AI代理技术深度解析与实战指南
历史上的今天:
2020-12-03 git如何查看最新的远程分支
2020-12-03 绑定点击事件,当点击事件里依赖异步返回结果则阻止冒泡失效
点击右上角即可分享
微信分享提示