为什么在 JavaScript 中使用空数组和 `.forEach.call()` ？

理解 JavaScript 中 [].forEach.call() 的行为

这个非常规的代码片段（其中 forEach 方法前面有一个空数组）一直让开发人员感到困惑。让我们深入研究一下它是如何工作的。

空数组 - 访问数组原型的技巧

空数组有一个特殊的用途：它提供对 .forEach 等数组原型的访问。使用数组直接为您提供此功能，无需显式编写 Array.prototype.forEach.call(...);。

forEach - 自定义迭代

forEach 是一个函数，将另一个函数作为输入。对于类似数组的对象（例如节点列表）中的每个元素，它传递三个参数：

• 元素本身
• 元素的索引
• 对类数组对象的引用

.call - 修改此上下文

.call 方法允许您使用特定的 this 上下文调用函数。在这种情况下，它用节点列表覆盖内部函数的 this，确保函数可以通过索引访问元素。

示例

考虑这个：

[1,2,3].forEach.call( document.querySelectorAll('a'), function(el) { /* logic */ });

此代码使用空数组访问 .forEach 原型，将节点列表传递给 forEach，并迭代每个 。标签，提供对元素、其索引和整个节点列表的访问。

揭穿函数式编程问题

虽然有些人认为与手动循环相比，使用这种技术不太优雅，但它确实有用当您需要在访问元素或索引信息时多次修改外部世界（例如 DOM）时，这是一个目的。

ES6 及其他版本中的现代解决方案

在现代 JavaScript 版本中并使用诸如Babel，您可以使用 ...rest 和 spread 运算符来更干净地实现类似的功能。但是，使用空数组进行数组原型访问以及使用 .call 修改此上下文的核心原则仍然相关。

以上是为什么在 JavaScript 中使用空数组和 `.forEach.call()` ？的详细内容。更多信息请关注PHP中文网其他相关文章！