如何调试 MDN Web Docs 示例？
How to debug MDN Web Docs examples?
假设我有 Javascript example in MDN:
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 按钮：
但是我可以 trace/debug 它带有断点并查看它的运行情况吗？
此示例的源代码位于 Chrome 或 FireFox 的开发人员工具中的什么位置？ And/or如何取消缩小？
它所在的位置：可能在一个动态模块中，可能使用 eval 或 new Function，在其 运行 之前立即生成，因此在此之前您将找不到它。
相反，您可以在需要断点的地方或仅在第一行添加 debugger statement，以便它立即进入正确的源模块，您可以根据需要在调试器中设置其他断点。
然后打开你的开发工具 运行。等待它在 debugger 语句中断并进行调试。
假设我有 Javascript example in MDN:
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 按钮：
但是我可以 trace/debug 它带有断点并查看它的运行情况吗？
此示例的源代码位于 Chrome 或 FireFox 的开发人员工具中的什么位置？ And/or如何取消缩小？
它所在的位置：可能在一个动态模块中，可能使用 eval 或 new Function，在其 运行 之前立即生成，因此在此之前您将找不到它。
相反，您可以在需要断点的地方或仅在第一行添加 debugger statement，以便它立即进入正确的源模块，您可以根据需要在调试器中设置其他断点。
然后打开你的开发工具 运行。等待它在 debugger 语句中断并进行调试。