网站首页 > 知识剖析 正文
在平时做Code Review的时候,经常会看到这样的代码:
someArray.map( x => console.log(x) )
我都会要求修改成forEach,但经常会遇到有人反问:为什么要修改,map也没报错,没问题啊。
今天就想聊一下这个问题。
其实上面的这个代码,还是会有很多人认为应该修改成forEach的,但理由并不一定对。因为提到forEach和map的区别时,很多人会直接不假思索地说:
一个有返回值,一个没有返回值。
这个答案对吗?对,但完全没有触及本质。
真正的答案是:这两个方法其实毫无关系,各自用在各自不同的场景之下,只是看起来能够实现相似的功能而已。
forEach,其实就是for的一个语法糖:
const callback = f
const target = arr
for(let i = 0; i < target.length; i++) {
f(target[i])
}
for代码块中,可以做任何事情,这只是一个按照顺序遍历的过程。
map来自于数学中的概念“函数”,也就是我们初中时候就学过的“一一映射”:把一个集合中的每一个值,按照某种变换过程,映射到另一个集合中。比如把所有的奇数加一,映射成所有的偶数。这个过程在语义上来说并不是“遍历”、“迭代”,而是所有值同时按照箭头方向直接变换,形成一个新的集合。
这个过程中,是不关心过程的,只关心从x到y的这个结果。而这个y很重要。所以,map必须有一个变量来接受新生成的这个y的集合。
同时,因为x到y的映射过程和第三者无关,所以在map的内部,不应该出现任何副作用(给函数外部的其他作用域中的变量赋值、输入、输出,包括网络请求等操作称为副作用)
换句话说:在学过map之前,大家都是用for和forEach来实现的功能,现在就应该还用for/forEach,只有在纯粹的把一个集合映射到另一个集合这一种场景下,大家才应该用map。
现在再回来看开头的那个例子,map有返回值是重点吗?不是。这个过程中出现了副作用,而且并没有把初始集合映射成任何新的集合(映射成了一个满是void的集合)
所以映射本身并不是重点,这就是一个普通的循环,理应直接用for/forEach,而不是选择map。
这样不知道是否解释清楚了呢?
猜你喜欢
- 2024-11-14 vue.js正确使用百度地图的方案 vue百度地图自定义控件
- 2024-11-14 七爪源码:如何在 JavaScript 中将 JSON 转换为地图
- 2024-11-14 在地图上创建热力图的方法 怎么用热力图选址
- 2024-11-14 快速了解 ES6 的Map与WeakMap es6 map使用场景
- 2024-11-14 Vue3 + TS + Leafletjs 打造企业级原神大地图
- 2024-11-14 好东西一起用,Cesium.js真是让3D地图尖叫的神奇框架!
- 2024-11-14 为 Next.js 项目创建站点地图文件
- 2024-11-14 JavaScript 轻松获取 Map 中的某个 key
- 2024-11-14 何时使用 Map 来代替普通的 JS 对象
- 2024-11-14 看了几十篇论文实现了个专业算法,用threejs做了个人员定位系统
- 最近发表
- 标签列表
-
- xml (46)
- css animation (57)
- array_slice (60)
- htmlspecialchars (54)
- position: absolute (54)
- datediff函数 (47)
- array_pop (49)
- jsmap (52)
- toggleclass (43)
- console.time (63)
- .sql (41)
- ahref (40)
- js json.parse (59)
- html复选框 (60)
- css 透明 (44)
- css 颜色 (47)
- php replace (41)
- css nth-child (48)
- min-height (40)
- xml schema (44)
- css 最后一个元素 (46)
- location.origin (44)
- table border (49)
- html tr (40)
- video controls (49)