Javascript效率：'for' vs 'forEach' [关闭]

Posted 2023-02-22

【中文标题】Javascript效率：\'for\' vs \'forEach\' [关闭]

【英文标题】：Javascript efficiency: 'for' vs 'forEach' [closed]Javascript效率：'for' vs 'forEach' [关闭]

【发布时间】：2017-08-19 07:25:47

【问题描述】：

2017 年 javascript 中 for() 循环与 .forEach 的当前标准是什么。

我目前正在通过 Colt Steeles 在 Udemy 上的“Web Dev Bootcamp”工作，他在他的教义中偏爱forEach 而不是for。然而，作为课程作业的一部分，我在练习期间搜索了各种东西，我发现越来越多的建议使用for-loop 而不是forEach。大多数人似乎都认为 for 循环更有效。

这是自课程编写以来（大约 2015 年）发生的变化，还是它们的真正优点和缺点，人们将通过更多的经验来学习。

任何建议将不胜感激。

【问题讨论】：

为什么要将自己与某人对 2017 年标准的主观想法联系起来？采用永恒的标准，例如编写干净、可维护的代码，了解工程师正在努力使最常用的结构变得非常高效，然后在遇到特定性能问题时优化性能

原生 for 的纯粹速度很难被击败。 forEach() 为每次迭代调用一个回调；所以，这显然会带来一些开销。

作为一个开发者，我几乎不使用 for 或 foreach，大部分工作都是通过 map、filter 或 reduce 方法完成的。

@A.T.只要您不是那些纯粹将map 用于迭代并丢弃它生成的新数组的人之一。我不知道仅在这个网站上我就必须纠正多少人对特定功能的选择。

@canon 同意，循环选择很重要，在选择时应牢记此类方法的输出和残留。我相信为了可读性，应该避免使用简单的“for循环”。

【参考方案1】：

为

for 循环效率更高。它是一个循环结构，专门设计用于在条件为 true 时进行迭代，同时提供步进机制（通常用于增加迭代器）。示例：

for (var i=0, n=arr.length; i < n; ++i ) 
   ...

这并不是说 for 循环总是更高效，只是 JS 引擎和浏览器已经将它们优化为如此。多年来，对于哪种循环结构更有效（for、while、reduce、reverse-while 等）一直存在妥协——不同的浏览器和 JS 引擎有自己的实现，它们提供不同的方法来产生相同的结果。随着浏览器进一步优化以满足性能需求，理论上[].forEach 可以以更快或与for 相媲美的方式实现。

好处：

高效 早期循环终止（荣誉 break 和 continue） 条件控制（i<n 可以是任何东西，并且不受数组大小的限制） 变量作用域（var i 在循环结束后留下 i 可用）

forEach

.forEach 是主要迭代数组的方法（也包括其他可枚举对象，例如 Map 和 Set 对象）。它们更新并且提供主观上更易于阅读的代码。示例：

[].forEach((val, index)=>
   ...
);

好处：

不涉及变量设置（迭代数组的每个元素） 函数/箭头函数将变量范围限定为块 在上面的示例中，val 将是新创建函数的参数。因此，在循环之前调用 val 的任何变量都会在循环结束后保持其值。 主观上更易于维护，因为它可能更容易识别代码在做什么——它正在迭代一个可枚举；而 for 循环可用于任意数量的循环方案

---

性能

性能是一个棘手的话题，通常需要一些经验来进行深思熟虑或方法。为了提前（在开发时）确定可能需要多少优化，程序员必须对过去处理问题案例的经验有一个很好的了解，并对潜在的解决方案有很好的理解。

在某些情况下使用 jQuery 有时可能会太慢（有经验的开发人员可能知道），而其他时候可能不是问题，在这种情况下，库的跨浏览器兼容性和执行其他功能的简易性（例如、AJAX、事件处理）值得节省开发（和维护）时间。

另一个例子是，如果性能和优化就是一切，那么除了机器或程序集之外就没有其他代码了。显然情况并非如此，因为有许多不同的高级和低级语言，每种语言都有自己的权衡。这些权衡包括但不限于专业化、开发容易和速度、维护容易和速度、优化代码、无错误代码等。

方法

如果您不太了解某些内容是否需要优化代码，那么首先编写可维护的代码通常是一个很好的经验法则。从那里，您可以测试并确定需要更多注意的地方。

也就是说，某些明显的优化应该是一般实践的一部分，不需要任何思考。例如，考虑以下循环：

for (var i=0; i < arr.length; ++i )

对于循环的每次迭代，JavaScript 都会检索 arr.length，这是每个循环的键查找成本操作。没有理由不应该这样做：

for (var i=0, n=arr.length; i < n; ++i)

这做同样的事情，但只检索一次arr.length，缓存变量并优化你的代码。

【讨论】：

出色、彻底、不自以为是的答案，不受单一时间点、实施或微基准测试的约束。

for-loop 在调试方面通常具有优势：它们很容易进入、断点和检查。使用 forEach() 额外的回调级别会使事情变得有点复杂。

我真的很喜欢这个答案和短语[...], if performance and optimization was everything, there would be no other code than machine or assembly. 中的解释。我相信使用 let 声明块范围局部变量的语句，forEach 的第二个好处不再是 for 循环的优势，除非在不支持 let 的环境中。

@Microsis 这里没有理由，当时可能是微优化，但这是不可避免的浏览器/引擎选项。当它们在示例中时，它们是等价的。有时在我的示例中，我尝试展示一种稍微不同的使用语法的方式来让新手思考。人们经常看到i++，但++i 引起了人们的注意并导致发现for循环的最后部分是一个表达式，它可以用于许多操作而不仅仅是设置循环增量.

我要补充一点，这个答案可能会使用一些更正更新或附录。例如，现在许多浏览器在内部对字节码进行了优化，因此如果满足某些条件，就会执行一次重复操作。我认为如果数组在循环体中未被触及，那么它只会检索一次arr.length。我欢迎更熟悉的人参与。