为什么这段 JavaScript 代码的结果是“undefined”？

Question

我正在尝试弄清楚为什么在浏览器控制台窗口中运行此JavaScript代码的结果是未定义的？难道不应该是“外部”吗？

var text = 'outside';
function logIt(){
    console.log(text);
    var text = 'inside';
};
logIt();

谢谢

- Yasir

Answer 1

这是“变量提升”的结果。 （请参阅http://adripofjavascript.com/blog/drips/variable-and-function-hoisting。）

为了使代码按您的预期运行，您需要在函数作用域内分配变量或将其作为参数传递给函数：

var logIt = function (){
    var text = 'outside';
    console.log(text);
    text = 'inside';
};
logIt();

或者

var text = 'outside';
var logIt = function (txtArg){
    console.log(txtArg);
    var text = 'inside';
};
logIt(text);

- David Noël

---

不会的。代码的行为是因为变量提升，而不是函数提升。 - Guffa

您提供的引用是404。 - arunwebber

Answer 2

在JavaScript中，变量被“提升”到函数的顶部。也就是说，与其他一些语言（如C语言）不同，在函数内声明的变量在整个函数范围内都是可见的。因此，编译器会将您的函数看作以下形式：

function logIt(){
    var text;
    console.log(text);
    text = 'inside';
} // <-- no semicolon after a function declaration

当你在logIt内部声明text作为局部变量时，它会遮盖外层作用域中的变量。而当一个变量被声明时，它被初始化为undefined。这就是为什么会输出undefined的原因。

如果你想保留外部作用域中的text，只需在函数内部省略var声明即可。

var text = 'outside';
function logIt(){
    console.log(text); // logs 'outside' now
    text = 'inside';
}
logIt();

- Chris Middleton

Answer 3

您的console.log(text)放置在错误的位置 :)

但是，这是Javascript变量提升。http://goo.gl/0L8h5D

这个：

var text = 'outside'
logIt = function () {
  console.log(text);
  var text = 'inside';
}
logIt();

等同于：

var text                    // hoisted to top of scope; text is undefined
text = 'outside'            // text is now assigned in place
logIt = function () {
  var text;                 // hoisted to top of scope; text is undefined
  console.log(text);        // spits out undefined
  text = 'inside';          // text is now assigned in place.
}
logIt();

为避免这类问题，养成在作用域块的顶部声明所有变量的习惯。

var text = 'outside'
logIt = function() {
  var text = 'inside'
  console.log(text)
}
logIt()

如果你的意图是输出“outside”，那么在logIt函数中应该使用不同的标识符名称。

- Kerry Kobashi

Answer 4

你正在覆盖变量text。要得到你想要的答案，请从第四行中去掉var。

原因是在函数内部有一个来自父范围或全局范围的名为text的变量，你正在更改它，然后在离开函数时将其丢弃。

- Emanuel Balea

Answer 5

声明变量text一次。演示

var text = 'outside';
function logIt(){
    console.log(text);
     text = 'inside';
};
logIt();

- Saravana Kumar

Answer 6

全局+本地：一个额外复杂的情况

var x = 5;

(function () {
    console.log(x);
    var x = 10;
    console.log(x); 
})();

这会打印出 undefined 和 10，而不是 5 和 10，因为 JavaScript 总是将变量声明（而非初始化）移动到作用域的顶部，使代码等效于：

var x = 5;

(function () {
    var x;
    console.log(x);
    x = 10;
    console.log(x); 
})();

从这个答案中JavaScript 中变量的作用域是什么？

- Raphael Kingazi