03_作用域与作用域链（JS高级）

在JavaScript中，作用域是定义变量可见性和生命周期的关键概念。JavaScript支持两种主要的作用域类型：全局作用域和函数作用域。此外，ES6引入了块级作用域的概念。

1. 全局作用域：在代码的任何地方都能访问到的变量被定义在全局作用域。在浏览器环境中，全局变量通常被定义在window对象上。例如：

   var globalVar = "I'm global!";

2. 函数作用域：在函数内部定义的变量只能在函数内部访问，这就是函数作用域。这意味着，如果你在一个函数内部定义了一个变量，那么这个变量在函数外部是不可见的。例如：

   function someFunction() {

   var functionVar = "I'm local!";

   }

3. 块级作用域：ES6引入了let和const关键字，它们具有块级作用域，意味着变量在最近的{}代码块内有效。例如：

   if (true) {

   let var = "I'm let!"; // 块级作用域

   }

一、作用域与执行上下文区别

1. 区别1

* 全局作用域之外，每个函数都会创建自己的作用域，作用域在函数定义时就已经确定了。而不是在函数调用时

* 全局执行上下文环境是在全局作用域确定之后, js代码马上执行之前创建

* 函数执行上下文是在调用函数时, 函数体代码执行之前创建

2. 区别2

* 作用域是静态的, 只要函数定义好了就一直存在, 且不会再变化

* 执行上下文是动态的, 调用函数时创建, 函数调用结束时就会自动释放

3. 联系

* 执行上下文(对象)是从属于所在的作用域

* 全局上下文环境==>全局作用域

* 函数上下文环境==>对应的函数使用域

二、作用域链 

1. 理解

* 多个上下级关系的作用域形成的链, 它的方向是从下向上的(从内到外)

* 查找变量时就是沿着作用域链来查找的

2. 查找一个变量的查找规则

* 在当前作用域下的执行上下文中查找对应的属性, 如果有直接返回, 否则进入2

* 在上一级作用域的执行上下文中查找对应的属性, 如果有直接返回, 否则进入3

* 再次执行2的相同操作, 直到全局作用域, 如果还找不到就抛出找不到的异常

  var a = 1
  function fn1() {
    var b = 2
    function fn2() {
      var c = 3
      console.log(c)
      console.log(b)
      console.log(a)
      console.log(d)
    }
    fn2()
  }
  fn1()

 三、习题

  var x = 10;
  function fn() {
    console.log(x);
  }
  function show(f) {
    var x = 20;
    f();
  }
  show(fn); // 10

  var fn = function () {
    console.log(fn)
  }
  fn()

  var obj = {
    fn2: function () {
     console.log(fn2) //这里会到全局作用域去找
     //console.log(this.fn2) 
    }
  }
  obj.fn2()