Javascript命名的函数定义在不应该执行时执行

Question

我不知道这里发生了什么.代码是:

  if( true ) { 

      console.log('In first function definition');

      function test(){
        console.log('Hello world');
      }

    } else {

      console.log('In the second function definition');

      function test(){
        console.log('Goodbye world');
      }

    }

  test();

我希望这会登录控制台:

'In the first function definition'
'Hello world'

但相反它记录:

'In the first function definition'
'Goodbye world'

当代码没有进入该分支时,如何创建第二个命名函数？

Answer 1

请记住,JavaScript中的所有内容都是功能范围的; 没有块范围.

为此,您在同一范围内定义了两个函数声明(无论if-else所在的范围),具有相同的名称,在不同的块中.这会在浏览器之间产生不一致的结果

您需要为这些函数指定不同的名称,或使用函数表达式,如下所示:

var f;
if(true) { 
   console.log('In first function definition');

   f = function(){
     console.log('Hello world');
   };

} else {
  console.log('In the second function definition');

  f = function(){
    console.log('Goodbye world');
  };
}
f();

对你的优秀问题

但是如果我们不输入代码的那个分支,那么函数是如何定义的呢？如果没有执行该块,为什么要考虑范围？

简单的答案是函数声明被"提升",并且即使在声明本身之前,也可以立即在范围内的任何位置使用.

即:

function foo(){
    f(); //perfectly valid

    function f(){
    }
}

更长的答案是,在进入范围之前,所有变量声明和函数声明都被删除,并放在"激活对象"上.然后将激活对象放置在"范围链"的头部.执行该函数时,只需从那里解析对这些变量和函数的任何引用.