JavaScript Hoisting

JavaScript 中的变量提升（Hoisting）是指在代码执行过程中，JavaScript 解释器将变量声明（但不包括初始化）和函数声明提升到当前作用域的顶部。这意味着在代码执行之前，变量和函数的声明会被提升到当前作用域的顶部，但是赋值操作并不会提升。

变量提升

变量的声明会被提升，但是赋值不会提升。举个例子：

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

实际上，上述代码在执行时会被解释为：

var myVar; // 变量声明被提升
console.log(myVar); // 输出: undefined
myVar = 10; // 赋值操作保留在原处
console.log(myVar); // 输出: 10

函数提升

与变量提升类似，函数声明（不包括函数表达式）也会被提升到当前作用域的顶部。例如：

hello(); // 输出: Hello, world!
function hello() {
  console.log('Hello, world!');
}

上述代码在执行时，实际上会被解释为：

function hello() {
  console.log('Hello, world!');
}
hello(); // 输出: Hello, world!

注意事项

只提升声明，不提升赋值：

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

变量 myVar 的声明被提升，但赋值操作 myVar = 10 并没有被提升，因此第一行输出的是 undefined。

函数优先于变量：

 如果同时存在同名变量和函数声明，函数声明会优先于变量提升。

var myVar = 'global';
function myFunc() {
  console.log(myVar); // 输出: undefined
  var myVar = 'local';
  console.log(myVar); // 输出: local
}
myFunc();

在 myFunc() 函数中，变量 myVar 被声明并提升，但在函数内部，函数声明优先于变量声明。因此，第一个 console.log(myVar) 输出 undefined，而第二个 console.log(myVar) 输出 local。

函数表达式不会提升： 

函数表达式（如使用 var, let, const 声明的函数）不会被提升，只有函数声明会被完全提升到顶部。

console.log(myFunc); // 输出: undefined
var myFunc = function() {
  console.log('Function expression');
};

在上面的例子中，myFunc 是一个函数表达式，不会被提升，因此第一行输出 undefined。

总结

JavaScript 的变量提升使得在代码执行之前，可以访问变量和函数的声明。了解和理解变量提升的工作原理有助于编写更清晰、更具可维护性的 JavaScript 代码，同时避免由于提升机制导致的潜在错误。