浅谈JavaScript 声明提升

声明提升的概念

在JavaScript中，声明提升指的是在代码执行阶段，JavaScript引擎会把所有声明的变量和函数提升至当前作用域的顶部，但是赋值操作并不会提升。这意味着可以在变量和函数声明之前使用它们，因为它们已经被预处理并提升到作用域顶部。

变量声明提升

变量声明提升指的是在JavaScript引擎执行代码之前，会预处理所有的变量声明，并将它们提升至当前作用域顶部。这意味着我们可以在声明变量之前使用它们。看下面的例子：

console.log(myNum); // 输出 undefined
var myNum = 10;

在这个例子中，变量 myNum 被声明了，但是在它被赋值之前，我们尝试输出它的值。由于JavaScript会将变量声明提升到作用域顶部，因此这个代码是有效的。但是由于变量被声明但没有被赋值，所以会输出 undefined。

函数声明提升

函数声明提升指的是在JavaScript引擎执行代码之前，预处理所有函数定义，并将它们提升至当前作用域的顶部。这意味着在代码中可以在函数声明之前调用函数。看下面的例子：

foo(); // 输出 "hello"
function foo() {
    console.log("hello");
}

在这个例子中，函数 foo 在它被调用之前被声明。由于函数声明被提升到作用域的顶部，所以这个代码是有效的。你会在控制台上看到 "hello" 输出。

注意事项

在使用声明提升时，一定要注意变量和函数的作用域。如果它们被声明在函数作用域内，那么它们只在函数内部可见，而不是在全局作用域内可见。另外，在ES6中，使用 let 和 const 声明的变量没有声明提升，因此无法在声明之前使用。

示例 1

function bar() {
  console.log(a); // 输出 undefined
  var a = "hello";
}

bar();

在这个例子中，函数 bar 在被调用时会输出 undefined。这是因为变量 a 被声明了，但在它被赋值之前被输出了。

示例 2

function baz() {
  console.log(x); // Uncaught ReferenceError: x is not defined
  let x = "world";
}

baz();

在这个例子中，函数 baz 在被调用时会抛出 ReferenceError 错误。这是因为使用 let 声明的变量 x 没有被提升，因此无法在声明之前使用。