如何在Google Chrome DevTools的lambda调用中设置断点？

Question

我使用启用了JavaScript源地图的Babel和Google Chrome开发者工具。鉴于此代码

function myFunc(elements) {
  return elements
    .map(element => element.value)
    .filter(value => value >= 0);
}

如何在执行lambda函数element => element.value时暂停执行？如果我在.map(element => element.value)行设置断点，它只会在执行map时暂停，但不会在执行lambda函数时暂停。

Answer 1

此功能最终可用（至少在Google Chrome 58中）。单击要调试的lambda行的行号（此处为第3行）。然后通过单击激活lambda中的标记（此处为第二个）。此外，我在这里禁用了第一个标记，它会在map调用（而不是lambda）上暂停：

当你的程序运行并命中断点时，它会暂停，你可以检查变量：

Answer 2

您可以使用debugger关键字来指示调试器在该位置暂停，并且可以像任何JavaScript语句一样插入调试器。

function myFunc(elements) {
  return elements
    .map(element => {debugger; return element.value})
    .filter(value => value >= 0);
}

Answer 3

您可以执行以下操作：

    function myFunc(elements) {
      return elements
        .map(element => {
           element.value
        })
        .filter(value => value >= 0);
    }

这样您就可以在行element.value

中添加断点

无法在没有代码更改的情况下找到使其正常工作的方法 如果有人能找到方法请告诉。