Javascript函数执行和嵌套函数调用

Question

我已经学习了几个月的javascript我参加了一个js测验我看到了这个问题我无法理解这个非常简单的代码的执行流程，如果有人能清楚地向我解释它会非常有帮助， 提前致谢var a = 'Is';function test() {    var a = 'Fun';    function again() {        var a = 'JavaScript';        alert(a);    }    again();    alert(a);}test();alert(a);输出Javascript Fun Is

Answer 1

1: var a = 'Is';

2: function test() {

3:     var a = 'Fun';

4:     function again() {

5:         var a = 'JavaScript';

6:         alert(a);

7: 

8:     }

9:     again();

10:    alert(a);

11: }

12: test();

13: alert(a);

在执行第 1 行之前：将一个变量a初始化为 valueundefined和一个 function test，添加到当前的词法环境中。如果此代码在全局上下文中运行，这些变量将作为属性添加到全局对象上。

第 1 行：字符串'Is'被分配给a这个词法环境中的变量。

第 12 行：[[Call]]在函数 上调用隐藏方法test，并创建一个新的执行上下文，其中包含一个变量a（初始值为undefined）和一个again添加到其词法环境中的函数。

第 3 行：字符串'Fun'被分配给a这个词法环境中的变量。

第 9 行：[[Call]]在函数 上调用隐藏方法again，并创建一个新的执行上下文，并在其词法环境中添加一个变量a（初始值为）。undefined

第 5 行：字符串'JavaScript'被分配给a这个词法环境中的变量。

第 6 行：调用主机提供的函数，传递与此词法环境window.alert中的变量关联的值( )。a'JavaScript'

第 10 行：调用主机提供的函数，传递与此词法环境 ( )window.alert中的变量关联的值。a'Fun'

第 13 行：调用主机提供的函数，传递与此词法环境window.alert中的变量关联的值( )。a'Is'

Answer 2

这都是关于变量范围和闭包的。首先test被调用，所以脚本运行它。在test函数内部，新函数again被创建和调用。

每个子函数都可以访问父函数变量（闭包），但如果子函数本身有一个变量，即覆盖父函数的变量（var a），那么子函数将使用它自己的变量（或最近闭包中的变量）。

例如：

const a = 1;

function first(){

   const a = 2

   console.log(a)

   function(){

     console.log(a)

   }

}

将控制台日志：

2

2

Answer 3

希望在控制台日志的帮助下，您将能够理解控制流程。

按 Ctrl+Shift+I ，运行此答案末尾的代码片段。

现在使用这些按钮浏览流控制。

debugger

var a = 'Fun';

function test() {

    console.log("Im in test");

    var a = 'Is';

    function again() {

       console.log("Im in again");

        var a = 'JavaScript';

        alert(a);

  

    }

    again();

    console.log("Iam here after calling again");

    alert(a);

}

test();

console.log("Im here after calling test");

alert(a)