一次让你了解全部JavaScript的作用域

一次让你了解全部JavaScript的作用域的攻略包含了以下步骤：

第一步：理解作用域和作用域链

在JavaScript中，作用域是指变量可访问的范围。JavaScript中的作用域是词法作用域，即作用域的范围由代码中变量和函数声明的位置决定。当搜索变量时，会沿着作用域链一级一级地向上查找变量定义。作用域链是指一个指向外部环境的指针列表，它指向所有父级作用域，直到找到目标变量。

第二步：介绍全局作用域

全局作用域是指在全局范围内定义的变量，可以在代码的任何地方被访问。在浏览器中，全局作用域是window对象，也就是说全局变量实际上是window对象的属性之一。

示例1：全局作用域中定义变量

var name = "John";
function sayName() {
  console.log(name);
}
sayName(); // 打印输出 "John"

在示例1中，变量name在全局作用域中声明，函数sayName可以访问该变量并打印输出。函数在查找变量时将一直向上查找到全局作用域。

第三步：介绍局部作用域

在函数内部定义的变量只能在该函数内部访问，这种作用域称为局部作用域。

示例2：局部作用域中定义变量

function greet() {
  var message = "Hello";
  console.log(message);
}
greet(); // 打印输出 "Hello"
console.log(message); // 报错：message未定义

在示例2中，变量message在函数greet的内部作用域中声明，该变量不能在函数外部访问，因此在函数外部访问该变量会导致报错。

第四步：介绍块级作用域

ES6引入了块级作用域，用于限制变量的可访问范围。块级作用域可以由花括号{}定义，如if语句或for循环语句。

示例3：块级作用域中定义变量

if (true) {
  let message = "Hello";
  console.log(message);
}
console.log(message); // 报错：message未定义

在示例3中，变量message在if语句的块级作用域中定义，该变量只能在该块级作用域内访问，因此在块级作用域外访问该变量会导致报错。

通过理解作用域和作用域链、全局作用域、局部作用域和块级作用域，可以全面理解JavaScript的作用域概念，进而编写出更加健壮的代码。