一、作用域的概念

当我们讨论JavaScript的作用域原理时，主要涉及到三个关键概念：全局作用域（Global Scope）、函数作用域（Function Scope）和块级作用域（Block Scope）。

全局作用域（Global Scope）：全局作用域是指在代码的最外层定义的变量和函数，它们可以被程序中的任何部分访问。在浏览器环境下，全局作用域通常是指window对象。全局作用域中定义的变量和函数在整个程序执行过程中都是可见的。
函数作用域（Function Scope）：函数作用域是指在函数内部定义的变量和函数，它们的作用域限制在函数内部。这意味着函数外部无法直接访问函数内部的变量和函数，但函数内部可以访问函数外部的变量。每当函数被调用时，都会创建一个新的函数作用域。
块级作用域（Block Scope）：块级作用域是指在代码块（通常由一对花括号{}包裹）内部定义的变量和函数，例如在if语句、循环或者块级作用域中的变量。在ES6（ECMAScript 2015）之前，JavaScript只有全局作用域和函数作用域，没有块级作用域。ES6引入了let和const关键字，允许在块级作用域中定义变量，从而限制变量的作用范围在块级作用域内。

二、作用域的原理

JavaScript的作用域原理是基于词法作用域（Lexical Scope）的。
词法作用域是指变量的可见性和访问权限是在代码编写阶段确定的，而不是在运行时确定的。
在词法作用域中，每个函数都会创建一个新的作用域，并且作用域嵌套关系由函数的定义位置决定。这意味着内部函数可以访问外部函数的变量，但外部函数不能访问内部函数的变量。

三、作用域链

作用域链（Scope Chain）是用于解析标识符（变量名或函数名）的机制。当访问一个变量时，JavaScript引擎首先在当前作用域中查找标识符，如果找不到，则向上一级作用域继续查找，直到找到该标识符或者达到全局作用域。如果在全局作用域中仍然找不到，则抛出引用错误（ReferenceError）

四、作用域提升

var的函数作用域：使用var关键字声明的变量具有函数作用域。这意味着变量在声明所在的整个函数中可见，而不仅限于声明的位置。函数作用域中的变量在函数内部任何地方都是可访问的。
```
function example() {
  var x = 10;
  if (true) {
    var y = 20;
    console.log(x); // 可访问，输出 10
  }
  console.log(y); // 可访问，输出 20
}
example();
```
在上面的例子中，变量x和y都是函数作用域的变量，它们在函数内部的任何地方都是可见的。
var的变量提升：使用var关键字声明的变量存在变量提升的特性。变量提升意味着在代码执行之前，JavaScript 引擎会将变量的声明提升到其所在作用域的顶部。这意味着我们可以在变量声明之前访问该变量，尽管它的值为undefined。
```
console.log(x); // 输出 undefined
var x = 10;
```
在上述例子中，变量x的声明被提升到console.log语句之前，但是它的赋值操作仍然在原来的位置。因此，console.log(x)会输出undefined而不是10。

变量提升的机制使得在同一个作用域中，无论变量的声明在哪里，都可以在作用域内的任何位置进行访问。值得注意的是，虽然var存在变量提升，但它不会产生块级作用域。var声明的变量在整个函数范围内可见，而不仅限于声明所在的块级作用域。这与使用let或const声明的变量不同，后者具有块级作用域。因此，在使用var时，需要特别注意变量的作用域范围，以避免意外的结果。

js的作用域原理以及相关内容

一、作用域的概念

二、作用域的原理

三、作用域链

四、作用域提升