JavaScript 变量未定义与未定义 [英] JavaScript variable undefined vs not defined

问题描述

我有一个附有以下 JavaScript 的 HTML 页面.

I have an HTML page with the following JavaScript attached.

alert(box);
box = "Thinking outside the box";

在控制台中，我收到未捕获的引用错误:未定义框"

In the console I get "Uncaught ReferenceError: box is not defined"

当我将其更改为:

alert(box);
var box = "Thinking outside the box";

警报被调用并显示未定义.我需要能够解释这一点，我对为什么会发生这种情况有一个模糊的想法.我知道当我使用 var 时，JavaScript 在执行警报之前就知道该变量存在，但不一定为其赋值??我离这儿很远吗?需要一些帮助来理解这一点.

The alert gets called and shows undefined. I need to be able to explain this, I have a vague idea of why this happens. I know that when I use var, JavaScript knows the variable is there before the alert is executed, but has not necessarily assigned a value to it?? Am I way off here? Need some help understanding this.

推荐答案

当你用 var 定义一个变量时，变量的声明被提升"到作用域的顶部，因此变量是为整个范围定义的.变量的初始化(为其分配初始值)保持在代码中的相同位置.

When you define a variable with var, the declaration of the variable is "hoisted" to the top of the scope and thus the variable is defined for the entire scope. The initialization of the variable (assigning it's initial value) remains at the same location in the code.

所以，在你的第二个例子中，当你执行 alert(box) 时，变量 box 已经被声明了，因为 var> 声明.你的第二个例子:

So, in your second example, when you do alert(box), the variable box has already been declared because of the hoisted var statement. Your second example:

alert(box);
var box = "Thinking outside the box";

基本上等价于这个(box 变量的声明被提升到作用域的顶部):

is basically equivalent to this (the declaration of the box variable is hoisted to the top of the scope):

var box;
alert(box);
box = "Thinking outside the box";

这使得 box 变量在你的 alert(box) 语句之前声明(虽然没有初始化)，因此你得到的结果与被声明的变量一致，但还没有值(alert() 报告 undefined 这是当变量存在但尚未初始化时发生的情况).

This makes the box variable declared (though not initialized) before your alert(box) statement and thus you get a result that is consistent with the variable being declared, but having no value yet (the alert() reports undefined which is what happens when the variable exists, but is not yet initialized).

您的第一个示例不使用 var，因此没有提升，因此在您执行 alert(box) 的地方，根本没有名为 box 从而得到 uncaught reference error.

Your first example does not use var and thus there is no hoisting so at the point where you do alert(box), there is no variable at all named box and thus you get the uncaught reference error.

这里有很多关于 SO 的帖子描述了提升的细节.你可以在这里看到一长串的列表:https://stackoverflow.com/search?q=javascript+variable+提升，您将在其中找到有关变量提升的进一步说明.

There are many, many posts here on SO that describe the details of hoisting. You can see a long list of them here: https://stackoverflow.com/search?q=javascript+variable+hoisting where you will find further explanation of variable hoisting.

注意:函数声明也被提升了，所以你找到的一些帖子将是关于函数声明而不是变量声明，尽管概念几乎相同.

Note: function declarations are also hoisted so some of the posts you find will be about function declarations rather than variable declarations, though the concept is pretty much the same.

这篇关于JavaScript 变量未定义与未定义的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！