Question

我正在探索javascript的作用域，后来才知道这个问题。我不明白这个问题是怎么解决的。

function checkType() {
  return foo;
  foo = 10;

  function foo() {};
  var foo = 11;
};

console.log(typeof checkType())

我的问题是这是javascript编译器如何确定返回函数不变的。欢迎提供任何参考或解释。

Answer 1

这是编译器将编译以上代码的方式。

function checkType() {
  var foo = function() {}; /* function will be hoisted to the top, 
                              and will be assigned to the variable as 
                              the name is the same for the two.. */
  return foo;

  // Code will never reach here as you are returning before this
  foo = 10;
  foo = 11;
};

console.log(typeof checkType());

使用function()语法定义的函数将被提升，在这种情况下，嵌套函数将被提升到checkType()中，因此checkType()返回该函数，而不是返回整数。

注意：由于该函数是使用function(){}语法定义的，因此它被提升到父函数作用域，否则，如果该函数是使用var foo = function() {}定义，则吊装不会以相同的方式工作，则您的函数将返回undefined。

有关范围确定和吊装的更多参考

http://www.adequatelygood.com/2010/2/JavaScript-Scoping-and-Hoisting/

Answer 2

首先，将所有函数声明悬挂在作用域中。因此，首先，代码将变量foo移至作用域的顶部，并将其值初始化为函数。

未悬挂变量的第二个声明，因为已经悬挂了函数声明。因此代码与

相同

function checkType() {
  var foo = function(){}
  return foo;
  foo = 10;

  foo = 11; 
};

Answer 3

运行代码时，有两个阶段，第一阶段是creation phase，在此阶段，语法分析器将读取代码并提升函数和变量，第二阶段是execution phase，其中值分配给提升变量，

要注意的一点 ，这里的功能是在创建阶段存储在内存中的，因为在这里变量被提升但值未初始化（将在执行阶段分配）

提升后，编译器将像这样对待代码

function checkType() {
  var foo = function() {}; //hoisted function
  return foo;
  foo = 10;
  foo = 11;
};

console.log(typeof checkType(), '\nRturned value from function  --->', checkType())

如果您将函数定义为变量，那么它将仅被提升但不会使用值初始化，您可以看到以下示例

function checkType() {
  return foo;
  foo = 10;

  var foo = function foo() {};
  var foo = 11;
};

console.log(typeof checkType(), '\nRturned value from function  --->', checkType())

理解此代码的方式。如何运作？

3 个答案: