• 变量
    • 作用域
    • 作用域链
    • 闭包

0-1javascript变量

1JavaScript 变量:JavaScript 变量是存储数据值的容器
声明(创建) JavaScript 变量:通过 -var- 关键词来声明 JavaScript 变量:

0-2javascript作用域

2JS作用域大致分为三:全局作用域和局部作用域,以及ES6的块级作用域
全局作用域:最外层函数定义的变量拥有全局作用域,即对任何内部函数来说,都是可以访问的:

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

局部作用域:和全局作用域相反,局部作用域一般只在固定的代码片段内可访问到,而对于函数外部是无法访问的,最常见的例如函数内部

<script>
      function fn(){
         var innerVar = "inner";
      }
      fn();
      console.log(innerVar);//报错,是没有定义
</script>

值得一提的是如果你在函数内部没有用var定义函数,那你其实声明了一个全局的变量

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

同样原理我们看如下代码:

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

不要怀疑,对就如你眼中看到一样,js和别的语言有区别,函数内定义了一个局部变量,函数在解析的时候都会将这个变量“提前声明”

0-3javascript作用域链

我对作用域链的理解是:
在内部函数可以访问外部函数变量的这种机制,用所梯度链式查找的方式,决定哪些数据能被内部函数访问的过程。 那我就想问,为啥内部可以访问外部?

0-4javascript执行环境

所谓执行环境(有时也称环境)它是JavaScript中最为重要的一个概念。执行环境定义了变量或函数有权访问的其他数据 ,决定了它们各自的行为。js为每一个执行环境关联了一个变量对象。环境中定义的所有变量和函数都保存在这个对象中.
①比如:

<script>
      var name = "小美"; 
      function got1(){
         return name; 
      }
      function got2(){
         return name;
      }
      got1();
      got2();
</script>

全局执行环境是最外围的执行环境,全局执行环境被认为是window对象,因此所有的全局变量和函数都作为window对象的属性和方法创建的。 js的执行顺序是根据函数的调用来决定的,当一个函数被调用时,该函数环境的变量对象就被压入一个环境栈中。而在函数执行之后,栈将该函数的变量对象弹出,把控制权交给之前的执行环境变量对象

当某个函数第一次被调用时,就会创建一个执行环境(execution context)以及相应的作用域链,并把作用域链赋值给一个特殊的内部属性([scope])。然后使用this,arguments(arguments在全局环境中不存在)和其他命名参数的值来初始化函数的活动对象(activation object)。当前执行环境的变量对象始终在作用域链的第0位。
因此我们可以看过程图:当got1()第一调用的时候,会创建一个由got1函数对象创建的执行环境,可以看到got1里并没有scope变量,于是沿着作用域链(scope chain)向后寻找,结果在全局变量对象里找到了scope,所以就返回全局变量对象里的scope值。执行过后,栈会将got1()对象“销毁”,然后执行同样步骤的got2()

那这些又和闭包有什么关系那?

<script>
      function out(){
         var scope = "outer";
         function into(){
            return scope;
         }
         return innto;
      }
      var fn = out();
      fn();
</script>

以上其实就是一个闭包,而闭包的原理也就是图鉴的原理!我们分析代码:

outer()内部返回了一个into函数,

  • ①当调用out时,into函数的作用域链就已经被初始化了,(也就是说已经执行了图示的过程,在本作用域内没有,然后到父级类找)
  • ②一般来说,当某个环境中的所有代码执行完毕后,该环境被销毁(弹出环境栈),保存在其中的所有变量和函数也随之销毁(全局执行环境变量直到应用程序退出,如网页关闭才会被销毁) 但是像上面那种有内部函数的又有所不同
  • ③当out()函数执行结束,执行环境被销毁,但是其关联的活动对象并没有随之销毁,而是一直存在于内存中,因为该活动对象被其内部函数的作用域链所引用

0-5闭包

0-5-1什么是闭包?

闭包:闭包(Closure)是JavaScript语言中一个非常重要的特性

  • MDN:闭包是函数和声明该函数的词法环境的组合。
  • 在Javascript语言中,只有函数中的子函数才能引用函数中的变量,简单来说,闭包就是定义在函数中的函数,是函数内外部连接的桥梁
  • 闭包的意义是:当前作用域总是能够访问外部作用域中的变量;函数是唯一拥有自身作用域的结构,所以闭包的创建依赖于函数
  • 百度百科:闭包就是能够读取其他函数内部变量的函数。例如在javascript中,只有函数内部的子函数才能读取局部变量,所以闭包可以理解成“定义在一个函数内部的函数“。在本质上,闭包是将函数内部和函数外部连接起来的桥梁。

0-5-2闭包的作用

  • 读取自身函数外部的变量(沿着作用域链寻找)
  • 让这些外部变量始终保存在内存中
  • 延长局部变量的生命周期
  • 维护私有变量-局部变量的安全

0-5-3闭包的条件

    1. 外层函数 和 子函数
    1. 外层函数必须有局部变量
    1. 子函数要操作外层函数的局部变量
    1. 让子函数和外部产生关联。 // 关联不一定是返回函数

0-5-4闭包案例

写个闭包:就用this,今天碰到的

 var name = "The Window";
  var object = {
    name : "My Object",
    getNameFunc : function(){
      return function(){
        return this.name;
      };
    }
  };
  alert(object.getNameFunc()());//result:The Window