函数内变量的范围和可用性

scope and availability of a variable inside a function

本文关键字：可用性 范围 变量 函数      更新时间：2023-09-26

我正在学习javascript，我的问题可能几乎不会在任何地方使用，但出于面试目的，我想清楚地理解这一点。 下面是代码。 第一个警报警报为"未定义"，第二个警报为"4"。 第二个是可以理解的。我想知道为什么第一个警报没有警报"5"并且未定义？相同的概念是什么？谢谢。

 var x = 5;
 function check(){
     alert(x);
     var x = 4;
     alert(x);
  }
 check();

var总是被提升（移动）到范围的开头。您的代码等效于以下内容：

 var x = 5;
 function check(){
     var x;
     alert(x);
     x = 4;
     alert(x);
  }
 check();

正如您清楚地看到的，本地x隐藏了全局x，即使本地的还没有值（因此第一个警报显示undefined）。

一点额外的：条件或其他块不会影响var声明的提升。

var x = 1;
(function() {
  x = 3;
  if (false) {
    var x = 2; // var will be moved to the begining of the function
  }
})()
console.log(x) // 1

JavaScript 有一些概念，肯定需要一点时间来适应，有时看似简单的问题的答案是冗长的，但我会尽量快速简洁。

在 JavaScript 中，变量由函数作用域，并且有两个地方可以将变量限定为"全局"或"本地"范围（具有上下文）。Web 浏览器中的全局上下文是"窗口"，因此在代码示例中var x = 5;是一个全局变量。代码中的本地上下文位于检查函数中，因此var x = 4;是检查函数的局部变量。如果你有更多的函数，它们将有自己的函数范围（上下文）等等。请注意，如果您在函数中声明变量时忘记了单词"var"，它将成为"全局"变量，请小心。现在我们已经有了"全局"、"本地"的范围，在Javascript程序运行之前会发生什么？

在执行代码之前，Javascript 引擎中会发生一些事情，但我们只看变量会发生什么。变量被称为"提升"到其功能上下文或范围的顶部。这意味着变量声明被"提升或移动到顶部"并分配值"undefined"，但未初始化初始化保留在相同的位置。这种提升还使变量在定义的函数中的任何位置可用。

所以它看起来像这样：

//to be accurate this is hoisted to its functional scope as well
var x;
x = 5;
function check() {
  //declaration of 'x' hoisted to the top of functional scope,
  //and assigned undefined
  var x;
  //this will alert undefined
  alert(x);
  //initialization of variable remains here
  x = 4;
  //so after the initialization of 'x' this will alert 4
  alert(x);
}
check();

快乐编码!!

顺便说一句：他们有一个名为"let"的新功能，您可以实现它以在我相信 EMCAScript 6 中添加块级范围，但尚未在所有浏览器中实现，所以这就是为什么我把它放在一边。

相关文章：