Skip to content

noForEach

诊断类别:lint/complexity/noForEach

¥Diagnostic Category: lint/complexity/noForEach

自从:v1.0.0

¥Since: v1.0.0

来源:

¥Sources:

首选 for...of 语句而不是 Array.forEach

¥Prefer for...of statement instead of Array.forEach.

以下是为什么 forEach 可能不被允许以及为什么 for...of 几乎是 forEach 的任何用例的首选的总结:

¥Here’s a summary of why forEach may be disallowed, and why for...of is preferred for almost any use-case of forEach:

  • 性能:使用 forEach 可能会导致性能问题,尤其是在处理大型数组时。当添加更多要求时,forEach 通常会与其他方法(如 filtermap)链接在一起,从而导致对同一数组进行多次迭代。鼓励 for 循环不鼓励链接并鼓励单次迭代逻辑(例如使用 continue 而不是 filter)。

    ¥Performance: Using forEach can lead to performance issues, especially when working with large arrays. When more requirements are added on, forEach typically gets chained with other methods like filter or map, causing multiple iterations over the same Array. Encouraging for loops discourages chaining and encourages single-iteration logic (e.g. using a continue instead of filter).

  • 可读性:虽然 forEach 是一种简单而简洁的数组迭代方法,但它会使代码的可读性降低,尤其是在回调函数复杂的情况下。相比之下,使用 for 循环或 for...of 循环可以使代码更明确,更易于阅读。

    ¥Readability: While forEach is a simple and concise way to iterate over an array, it can make the code less readable, especially when the callback function is complex. In contrast, using a for loop or a for...of loop can make the code more explicit and easier to read.

  • 调试:forEach 可以使调试更加困难,因为它隐藏了迭代过程。

    ¥Debugging: forEach can make debugging more difficult, because it hides the iteration process.

¥Caveat

我们认为所有具有名为 forEach 的方法的对象都是可迭代的。这样,此规则适用于所有具有名为 forEach 的方法的对象,而不仅仅是 Array 实例。

¥We consider all objects with a method named forEach to be iterable. This way, this rule applies to all objects with a method called forEach, not just Array instances.

¥Exception for Index Usage

当在 forEach 回调中明确使用索引时,可以使用 forEach。这是因为:

¥When the index is explicitly used in the forEach callback, it is acceptable to use forEach. This is because:

  • 索引可直接用作 forEach 中的第二个参数,这使其在需要索引的场景中非常方便。

    ¥The index is directly available as the second argument in forEach, making it convenient for scenarios where the index is necessary.

  • 在稀疏数组中,forEach 将跳过未定义的条目,这与包含这些条目的 for...ofObject.entries 的行为不同。这对于某些数组操作可能很重要,特别是在具有严格类型检查的 TypeScript 环境中。

    ¥In sparse arrays, forEach will skip undefined entries, which differs from the behavior of for...of with Object.entries that includes these entries. This can be important for certain array operations, particularly in TypeScript environments with strict type checking.

¥Examples

¥Invalid

els.forEach((el) => {
f(el);
})
code-block.js:1:1 lint/complexity/noForEach ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

Prefer for…of instead of forEach.

> 1 │ els.forEach((el) => {
^^^^^^^^^^^^^^^^^^^^^
> 2 │ f(el);
> 3 │ })
^^
4 │

forEach may lead to performance issues when working with large arrays. When combined with functions like filter or map, this causes multiple iterations over the same type.

els["forEach"](el => {
f(el);
})
code-block.js:1:1 lint/complexity/noForEach ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

Prefer for…of instead of forEach.

> 1 │ els[“forEach”](el => {
^^^^^^^^^^^^^^^^^^^^^^
> 2 │ f(el);
> 3 │ })
^^
4 │

forEach may lead to performance issues when working with large arrays. When combined with functions like filter or map, this causes multiple iterations over the same type.

¥Valid

els.forEach((el, i) => {
f(el, i)
})
for (const el of els) {
f(el);
}

¥Related links