在vscode中调试JavaScript时如何找到当前函数的闭包

Question

我正在通过VSCode和Chrome调试React JS应用程序。在断点处，我感兴趣的变量在变量列表的“关闭”部分中可见。在堆栈跟踪的其他级别，变量不可用。该函数是在其JS文件的顶级定义的，我看不到在哪里定义闭包，尤其是在第一次分配变量的地方。从其他地方调用的闭包作用域变量是不同的，我不明白为什么。

VS Code Debugging或Chrome Dev Tools中是否可以查看关闭范围的定义位置？

作为一个简单的示例，如果调试下面的JS代码并在a=1处遇到断点，是否有任何方法可以标识在其中定义a的closureScope变量？在实际示例中，函数和闭包作用域变量显然没有包含在任何其他函数或块中，但是我对现代JS和闭包的理解有限，并且我可能会遗漏一些明显的东西。

function main() {
  let closureScope = (
    function() {
    var a = 0;
    return {
      inside1: function() {
        a = 1;
      },
      inside2: function() {
        a = 2;
      }
    };
  })();

  closureScope.inside1();
  closureScope.inside2();
}

main();

Answer 1

您可以简单地在vscode或chrome中使用调试器

• 在代码中添加一个断点，您可以单击文件左侧的红点以添加一个断点
• 或在需要断点的地方使用debugger;
• 在左侧展开variable列表，然后展开closureScope以查看您在该特定范围内的价值

Answer 2

This is the alternative with Chrome dev tools