Provide an example alternative for `Array.forEach` with index

[iansan5653]

The documentation for the array-foreach rule provides an example of how to convert a forEach call to a for...of construction. However, that example doesn't show a best practice for accessing the array index, and this is not a problem with an obvious solution. For example, how can we convert the following to a for...of construction?

elements.forEach((element, index) => {...})

[koddsson]

This would probably just be a for-in loop.

for (const index in elements) {
  const element = elements[index]
  ...
}

[iansan5653]

for...in comes with its own problems - it does not guarantee that it will iterate over array elements in order. In fact, I think it would be wise to disallow for...in on arrays for this reason, though I don't know if that specificity is achievable with ESLint.

From MDN:

Note: for...in should not be used to iterate over an Array where the index order is important.

Array indexes are just enumerable properties with integer names and are otherwise identical to general object properties. There is no guarantee that for...in will return the indexes in any particular order. The for...in loop statement will return all enumerable properties, including those with non–integer names and those that are inherited.

Because the order of iteration is implementation-dependent, iterating over an array may not visit elements in a consistent order. Therefore, it is better to use a for loop with a numeric index (or Array.prototype.forEach() or the for...of loop) when iterating over arrays where the order of access is important.

---

An alternative is a regular for loop:

for (let index = 0; index < elements.length; index++) {
  const element = elements[index]
  ...
}

However this does not gracefully handle sparse arrays and is more verbose / harder to read than forEach.

---

I think maybe this rule should be revisited. forEach is readable, guarantees order, gives access to the index, and handles sparse arrays by skipping missing indexes.

[koddsson]

it does not guarantee that it will iterate over array elements in order.
An alternative is a regular for loop:

Yup, you'd probably use a for loop where the order is important.

I think maybe this rule should be revisited. forEach is readable, guarantees order, gives access to the index, and handles sparse arrays by skipping missing indexes.

Could you disable the rule in your project? Is this issue a specific problem in a github owned project?