如何调试MDN Web文档示例？

Question

假设我有MDN中的Javascript示例

const object = { a: 1, b: 2, c: 3 };

for (const property in object) {
  console.log(`${property}: ${object[property]}`);
}

// expected output:
// "a: 1"
// "b: 2"
// "c: 3"

我可以用Run按钮运行它：

​

​

但是，我可以使用断点跟踪/调试它，并查看它的运行情况吗？

此示例的源代码位于Chrome或FireFox中的开发工具中？和/或如何使它不受限制？

​

​

Answer 1

它所处的位置:可能在动态模块中，可能使用eval或new Function，在运行前立即生成，因此在此之前您不会找到它。

相反，您可以在需要断点的地方添加一个语句，或者只在第一行添加一个断点，这样它就可以立即进入正确的源模块，并且可以根据需要在调试器中设置其他断点。

然后打开你的devtools然后跑。等待它在debugger语句处中断并进行调试。