当前位置 : 主页 > 网络编程 > JavaScript >

JavaScript闭包详解

来源:互联网 收集:自由互联 发布时间:2022-04-19
目录 1. 什么是闭包 2. 闭包的作用 2.1) 记忆性 2.2) 模拟私有变量 3. 闭包的注意点 总结 1. 什么是闭包 闭包:函数本身和该函数声明时所处的环境状态的组合。 也就是说函数不在其
目录
  • 1. 什么是闭包
  • 2. 闭包的作用
    • 2.1) 记忆性
    • 2.2) 模拟私有变量
  • 3. 闭包的注意点
    • 总结

      1. 什么是闭包

      闭包:函数本身和该函数声明时所处的环境状态的组合。
      也就是说函数不在其定义的环境中被调用,也能访问定义时所处环境的变量。

      所以使用闭包,就可以将数据与操作该数据的函数相关联。

      举个例子:

      function foo() {
      	let a = 1;
      	return function() {
      		console.log(a);
      	}
      }
      let foo1 = foo();
      foo1() // 输出 1
      

      这个就是一个闭包的例子,在 foo 中,由于 return 了一个函数,这个函数拥有涵盖 foo 内部作用域的闭包,也就是 a,使得 a 一直存活,不会在 foo 结束时被回收。

      2. 闭包的作用

      2.1) 记忆性

      什么是闭包的记忆性

      当闭包产生时,函数所处环境的状态会始终保持在内存中,不会在外层函数调用结束后,被垃圾回收机制回收。

      举个例子:

      function foo() {
          let a = 0;
          return function() {
              a ++;
              console.log(a);
          }
      }
      let foo1 = foo();
      let foo2 = foo();
      foo1();  // 1
      foo2();  // 1
      foo2();  // 2
      foo1();  // 2
      

      在这里插入图片描述

      因为 a 属于闭包的一部分,所以当闭包产生时,a 所处的环境状态会保持在内存中,不会随外层函数调用结束后清除,所以随着 foo1的使用,a 都会在内存中的值加 1。
      然后 foo1 和 foo2 产生的闭包是两个独立的闭包,它们互不影响。所以 foo2 第二次调用的时候,是在它自己第一次调用后结果上加 1.

      2.2) 模拟私有变量

      保证一个变量只能被进行指定操作。

      举个例子

      function foo() {
      	let A = 0;
      	return {
      	    getA : function() {
      	        return A;
      	    }, 
      	    add : function() {
      	        A ++;
      	    },
      	    del : function() {
      	        A --;
      	    }
      	}
      }
      let foo1 = foo();
      console.log(foo1.getA()); // 0
      foo1.add();
      console.log(foo1.getA()); // 1
      foo1.del();
      console.log(foo1.getA()); // 0
      

      在这里插入图片描述

      通过闭包,保证了 A 只能被进行指定的 加一,减一操作。

      3. 闭包的注意点

      不能滥用闭包,否则可能会因为内存占用过多而造成网页的性能问题,甚至可能造成内存泄漏。

      总结

      本篇文章就到这里了,希望能够给你带来帮助,也希望您能够多多关注自由互联的更多内容!

      上一篇:HTML+CSS+JavaScript创建一个简单的井字游戏
      下一篇:没有了
      网友评论