ECMAScript-作用域

一、ECMAScript-作用域

1. 什么是作用域

引用维基百科定义：在电脑程序设计中，作用域（scope，或译作有效范围）是名字（name）与实体（entity）的绑定（binding）保持有效的那部分计算机程序。

也就是说：就是管理变量的存储和如何读取制定的规则。

通俗的讲就是：定义变量的适用范围。

2. 常见的作用域分类

对象	类型
self/global/window/globalThis	全局作用域
function	函数作用域（局部作用域）
{}	块状作用域
this	动态作用域

• 全局作用域

  通俗的讲就是全局都可以访问

  比如下面的定义：

  var a = 'zhangsan'
  
  // 函数外可调用a变量
  function test(){
      // 函数内可调用a变量
  }
  

  下面由于js的变量提升的原因，在self/global/window/globalThis这些对象上的属性也是全局作用域。

  // 比如函数体的a变量
  // 其实是window下的一个属性，也拥有全局作用域的特性，但是极其不推荐使用。
  function test(){
      a = 'zhangsan'
  }
  

• 函数作用域

  在函数内部定义的变量属于局部作用域。只存在函数内部访问，对外是封闭的，从外层的作用域无法直接访问函数内部的作用域。

  function test(){
      var a = 'zhangsan'
  }
  console.log(a) // ReferenceError: a is not defined
  
  // 如果想访问
  // 方式一：return
  function test(){
      var a = 'zhangsan'
      return a
  }
  console.log(test())
  
  // 方式二：闭包的方式
  function test(){
      var a = 'zhangsan'
      function result(){
          return a
      }
      return result()
  }
  console.log(test())
  

• 块状作用域

  // js中没有块状作用域的概念
  // es中依赖let/const定义的变量，存在这个概念
  if (true){
    let a = 2
    console.log(a)
  }
  

• 动态作用域，主要针对的是this

  window.b = 3
  
  function test() {
      console.log(this.b)
  }
  
  test.bind({
      b: 4
  })() // 4
  test() // 3