JavaScript变量作用域介绍

变量作用域

在JavaScript中，变量的作用域定义了变量的可访问性和有效范围。

全局作用域

在声明变量时，如果没有使用任何关键字（如var、let或const）进行修饰，则该变量的作用域是全局作用域。

全局作用域中声明的变量可以在整个程序中被访问。

示例：

// 声明一个全局变量
var globalVar = "我是全局变量";

function printGlobalVar() {
  console.log(globalVar); // 可以访问全局变量
}

printGlobalVar(); // 输出：我是全局变量

局部作用域

在函数内部声明的变量拥有局部作用域，在函数外部无法访问。

每个函数都会创建一个新的局部作用域，其范围限定在函数体内。

示例：

function printLocalVar() {
  var localVar = "我是局部变量";
  console.log(localVar); // 可以访问局部变量
}

printLocalVar(); // 输出：我是局部变量

console.log(localVar); // 报错：localVar未定义

块级作用域

在ES6（ECMAScript 2015）中，引入了let和const关键字来创建块级作用域变量。

块级作用域中的变量只在其所在的代码块内部有效。

示例：

if (true) {
  let blockVar = "我是块级变量";
  console.log(blockVar); // 可以访问块级变量
}

console.log(blockVar); // 报错：blockVar未定义

函数作用域与全局作用域

在函数内部声明的变量拥有函数作用域，即只在函数内可访问。

当在函数内部使用var关键字声明变量时，该变量为函数作用域。

示例：

function printLocalVar() {
  var localVar = "我是局部变量";
  console.log(localVar); // 可以访问局部变量
}

printLocalVar(); // 输出：我是局部变量

console.log(localVar); // 报错：localVar未定义

变量提升

在JavaScript中，变量提升是指变量和函数的声明会被提升到其所在作用域的顶部。这意味着可以在声明之前访问它们。

示例：

console.log(num); // 输出：undefined
var num = 5;

console.log(getMessage()); // 输出：Hello!
function getMessage() {
  return "Hello!";
}

在上面的示例中，变量num和函数getMessage()的声明被提升到作用域的顶部，所以可以在声明之前访问。

总结

变量作用域决定了变量的可访问性和有效范围。

全局作用域中的变量可以在整个程序中访问，而函数作用域和块级作用域中的变量只能在其所在的函数或代码块内部访问。

变量提升使得在声明之前就可以访问变量或函数。

正确理解变量作用域对于编写可维护和可读性强的JavaScript代码非常重要。