带你详细了解作用域和作用域链_作用域和作用域链的含义和使用场景-CSDN博客

本文链接：https://blog.csdn.net/fan_ge_/article/details/116089899

JavaScript 作用域

首先来了解一下作用域的含义：
在 JavaScript 中, 作用域为可访问变量，对象，函数的集合。
变量的作用域分为两种：全局变量和局部变量。

JavaScript 全局作用域

全局作用域：
最外层函数定义的变量拥有全局作用域，变量在函数外定义，即为全局变量。
全局变量有全局作用域: 网页中所有脚本和函数均可使用。

<script>
      var outerVar = "outer";
      function fn(){
         console.log(outerVar);
      }
      fn();//result:outer
   </script>

JavaScript 局部作用域

变量在函数内声明，变量为局部作用域。
局部变量：只能在函数内部访问。
最常见的例如函数内部：

<script>
      function fn(){
         var innerVar = "inner";
      }
      fn();
      console.log(innerVar);  //ReferenceError: innerVar is not defined
</script>

特别需要注意的是，函数内部声明变量的时候，一定要使用var命令。如果不用的话，就会提升到外部成为全局变量！

 <script>
      function fn(){
         innerVar = "laila";
      }
      fn();
      console.log(innerVar);// result:laila
   </script>

还有一个比较特别的例子：

<script> 
      var scope = "laila";
      function fn(){
         console.log(scope);//result:undefined
         var scope = "wuyifan";
         console.log(scope);//result wuyifan
      }
      fn();
   </script>

大家可能会以为第一个log输出的是全局变量“laila”，其实为undefined，这可以算是javascript的一个特点，只要函数内定义了一个局部变量，函数在解析的时候都会将这个变量“提前声明”：

JavaScript 变量生命周期

JavaScript 变量生命周期在它声明时初始化。
局部变量在函数执行完毕后销毁。
全局变量在页面关闭后销毁。

作用域链

由多级作用域连续引用形成的链式结果
掌管一切变量的使用顺序：先在局部找，没有，就延作用域向父级作用域找：

在JavaScript中，函数也是对象，实际上，JavaScript里一切都是对象。函数对象和其它对象一样，拥有可以通过代码访问的属性和一系列仅供JavaScript引擎访问的内部属性。其中一个内部属性是[[Scope]]，该内部属性包含了函数被创建的作用域中对象的集合，这个集合被称为函数的作用域链，它决定了哪些数据能被函数访问。
先来看一段代码：

<script>
name="qf";
function t(){
    var name="yyh";
    function s(){
        var name="cd";
        console.log(name);
    }
    function ss(){
        console.log(name);
    }
    s();
    ss();
}
</script>