关于JS闭包二三事

JS的闭包

闭包的定义
  • 闭包,实际上就是Javascript中一种函数的高级应用方式
形成闭包的条件
  • 有一个 A 函数,再 A 函数内部返回一个 B 函数
  • 再 A 函数外部有变量引用这个 B 函数
  • B 函数内部访问着 A 函数内部的私有变量
  • 以上三个条件缺一不可
       	//有一个 a 函数
        function a() {
            var num = 100
            //a 函数内部返回一个 b 函数
            return function b() {
            	//b 函数内部访问着 a 函数内部的私有变量
                console.log(num)
            }
        }
        //a 函数外部有变量引用 这个 b 函数
        var res = a()
        //这里的res实际上就是a函数的return返回值   b函数

了解闭包,需要先了解函数的两个阶段

一、定义阶段
  1. 开辟一个 存储空间
  2. 把和函数体内的代码一模一样的字符串放在这个空间内(不解析变量
  3. 把 存储空间 的地址给函数名
二、调用阶段
  1. 按照函数名的地址找到函数的 存储空间
  2. 形参赋值
  3. 预解析 (var的声明提升)
  4. 将函数 存储空间 中的代码拿出来执行(这个时候才解析变量
在函数的调用阶段,会在内存中开辟一个执行空间,而在函数执行完毕后,执行空间立即销毁。
  1. 按照函数名的地址找到函数的 存储空间
  2. 形参赋值
  3. 预解析
  4. 在内存中开辟一个 执行空间
  5. 将函数 存储空间 中的代码拿出来在刚刚开辟的 执行空间 中执行
  6. 执行完毕后,内存中开辟的 执行空间 销毁**

函数的执行空间

  		function fn() {
            console.log('这是一个函数')
        }
        fn()
  • 函数定义的时候会有一个存储空间(将其命名为xxff00),一直存在
  • 函数执行的时候会开辟一个 执行空间(将其命名为 xxff11)
  • console.log('我是 fn 函数')这个代码就是在 xxff11 这个空间中执行
  • 代码执行完毕以后,这个 xxff11 空间就销毁了
    -

不销毁的函数执行空间

  • 每一个函数都会有一个 存储空间
  • 但是每一次调用都会生成一个完全不一样的 执行空间
  • 并且 执行空间 会在函数执行完毕后就销毁了,但是 存储空间 不会
  • 那么这个函数空间执行完毕就销毁了,还有什么意义呢?
    • 我们可以有一些办法让这个空间 不销毁
    • 闭包,就是要利用这个 不销毁的执行空间,并且我们将这个不销毁的函数执行空间叫做 闭包空间
	function a() {
      // 这个 num 变量就是函数 a 的私有变量
      var num = 100
      return function b() {
        console.log(num)
      }
    }
    // res 接受的是 a 函数执行以后的返回值
    // res 接受的就是函数 a 内部返回的一个复杂数据类型(函数b)
    // 导致函数 a 的执行空间不会销毁
	var res = a()
	
	 res()//  打印出来为   100
	// 从现在开始, res 随时可以是一个 函数a 里面返回的 函数b
    //   res 随时可以调用
    // 当 res 调用的时候, 打印 num
    //   打印出来的就是 a 函数内部的私有变量 num 的值

在这里插入图片描述

  • a函数定义时生成一个存存储空间(xxff00)
  • a函数执行的时候,会生成一个a函数 执行空间 ( xxff11)
  • 代码在 xxff11 空间中执行
  • 在 xxff11 这个空间中生成了一个 b函数存储空间(xxff22)
  • 在 xxff11 这个执行空间把 xxff22 这个 存储空间 返回了
  • 函数外部 res 接受的是一个b函数的地址
    • 是一个在 xxff11 函数执行空间中的 xxff22 b函数存储空间
    • 因为 res 变量一直在和这个存储空间关联着,所以 xxff11 这个空间一直 不会销毁
      • 因为 xxff00 不会销毁,所以,定义再里面的变量 num 也不会销毁
      • 将来 res() 的时候,就能访问到 num 变量
  • 等到什么时候,执行一句代码 res = null
    • 此时, res变量不在关联着 xxff11 函数执行空间中的 xxff22 存储空间
    • 那么,这个时候函数执行空间 xxff11 就销毁了
      闭包就是利用了这个函数执行空间不销毁的逻辑

JS闭包的总结

一、JS闭包的定义
  • 闭包,实际上就是Javascript中一种函数的高级应用方式
  • 闭包通俗的来讲,就是函数内部的函数。
二、JS闭包的条件
  • 有一个 A 函数,再 A 函数内部(直接或间接)返回一个 B 函数
    • 直接返回一个B函数,return function b() { }
    • 间接返回一个B函数,reurn一个内部含有函数的数组或者对象
  • 再 A 函数外部有变量引用这个 B 函数
  • B 函数内部访问着 A 函数内部的私有变量
  • 以上三个条件缺一不可
三 JS闭包的特点
  • 每一个特点既是优点也是缺点
    1. 作用域空间不销毁
    优点: 因为作用域空间不销毁,因此变量同样不会被销毁,增加了变量的生命周期。
    缺点: 因为作用域空间不销毁,因此每一个闭包将会一直占用内存,多了以后就会导致内存溢出。
    2. 可以利用闭包访问再一个函数外部访问函数内部的变量
    优点: 可以在函数外部访问内部数据。
    缺点: 必须要时刻保持引用(在 A 函数外部有变量引用这个 B 函数),导致函数执行栈不被销毁。
    3. 保护私有变量
    优点: 可以把一些变量放在函数里面,不会污染全局。
    缺点: 要利用闭包函数才能访问,不是很方便。
发布了9 篇原创文章 · 获赞 9 · 访问量 462

猜你喜欢

转载自blog.csdn.net/k464746/article/details/104458331
今日推荐