每日前端面试题（5）：拨开云雾见曙光，变量提升揭秘

2023-09-18 15:00:50

变量提升概览

在 JavaScript 中，所有变量声明都会被提升到它们所在的作用域的顶部。这意味着，变量可以在被声明之前使用，而不会报错。变量提升只适用于变量声明，不适用于变量赋值。

变量提升有两种情况：

变量声明提升： 变量声明会被提升到作用域的顶部，但变量的值仍然是 undefined。
函数声明提升： 函数声明会被提升到作用域的顶部，并且函数体也会被提升。

变量提升示例

以下示例演示了变量提升是如何工作的：

console.log(a); // undefined
var a = 10;

function test() {
  console.log(b); // undefined
  var b = 20;
}

test();

在上面的示例中，变量 a 和 b 都在使用之前被声明了。变量 a 是一个全局变量，变量 b 是一个局部变量。当脚本执行时，变量 a 和 b 都被提升到全局作用域的顶部。这意味着，在变量 a 和 b 被赋值之前，它们的值都是 undefined。

当执行 console.log(a) 时，变量 a 的值是 undefined，因为变量 a 还没有被赋值。当执行 console.log(b) 时，变量 b 的值也是 undefined，因为变量 b 还没有被赋值。

当执行 test() 时，函数 test() 被提升到全局作用域的顶部。这意味着，函数 test() 的函数体也被提升到了全局作用域的顶部。当函数 test() 被执行时，变量 b 被提升到函数 test() 的作用域的顶部。这意味着，在变量 b 被赋值之前，变量 b 的值都是 undefined。

函数声明提升示例

以下示例演示了函数声明提升是如何工作的：

function test() {
  console.log("Hello, world!");
}

test(); // Hello, world!

var test = function() {
  console.log("Hello, world!");
};

test(); // Hello, world!