在嵌套的each循环中无法访问顶层变量。Javascript？

Question

使用此代码：

addDefaultComments() {
    $('.image').each((index, image) => {
      Comment.defaults.forEach((comment) => {
        debugger;
        $('#images').find(`ul[data-id=${imageId}] ul#comments-${imageId}`).append(`<li>${comment.commentContent}</li>\n`);
      })
    })
  }

在这个debugger语句中，我不应该能够访问图像和索引吗？当我调用它们时，它说它们没有定义。这不奇怪吗？

证明有些奇怪的事情正在发生：

- Jwan622

---

请提供截图。 - Jwan622

哇，将它更改为常规函数确实有效，@darthaditya。发生了什么事？ - Jwan622

不应该发生这种情况。在箭头函数中唯一的作用域差异应该是 this。 - Barmar

好的，这很棒。这可能是因为jQuery使用arguments对象来迭代子节点。箭头函数与arguments对象不兼容。 - darthaditya

我怀疑这是调试器的副作用，因为嵌套函数没有使用那些变量，所以它们不会被包含在闭包中。 - Barmar

Answer 1

在这个调试语句中，我不应该可以访问 image 和 index 吗？ 是的，你应该可以；除非由于未使用它们而被优化掉。这就是正在发生的事情。Chrome会积极地优化函数，因为你实际上没有在任何地方使用 index 或 image。如果你使用它们，它们就会出现：

如果您想尝试，请使用此jsfiddle链接：http://jsfiddle.net/Lbe2pue0/

只有当您不使用它们时，它们才不存在：

(这是那个fiddle链接: http://jsfiddle.net/Lbe2pue0/1/)

(我认为很有趣的是，Chrome在箭头函数中进行了这种优化，但在function函数中却没有...)

- T.J. Crowder

---

好的，但是为什么使用普通函数时它可以工作呢？ - darthaditya

（我认为Chrome在箭头函数中进行这种优化而不是在普通函数中进行，这很有趣...）啊，也许这是Chrome的一个怪癖。每天都能学到新东西。 - darthaditya

@darthaditya：不同的优化。实际上，由于存在debugger;语句，你可以认为它应该像这样优化箭头函数（正是出于这个原因）。但是现在确实这样做了。但这只是调试器的东西；那些参数确实在作用域内，如果你在实际代码中使用它们，它们将存在（不会被优化掉）。 - T.J. Crowder

yo this be cray cray - Jwan622