五分钟完全弄懂JS闭包

JS中函数是一等公民

在JavaScript中，函数是非常重要的，并且是一等公民： 那么就意味着函数的使用是非常灵活的； 函数可以作为另外一个函数的参数，也可以作为另外一个函数的返回值来使用； 自己编写高阶函数 自己编写的高阶函数指的就是这个函数既可以作为另一个函数的参数被使用，也可以作为另一个函数的返回值 使用内置的高阶函数 常见的内置高阶函数有很多，比如filter、map、reduce等等

JS中闭包的定义

这里先来看一下闭包的定义，分成两个：在计算机科学中和在JavaScript中。

闭包的访问过程

如果我们编写了如下的代码，它一定是形成了闭包的：

// js语法允许函数内部再定义函数
function foo() {
          
   
  var name = foo
  var age = 18
  function bar() {
          
   
    console.log(name)
    console.log(age)
  }
  return bar
}

var fn = foo()
fn()

1、创建GO对象，创建全局执行上下文并压入执行上下文栈中

2、执行foo()，创建foo函数的AO对象

3、创建foo函数执行上下文并压入执行上下文栈中，然后开始执行foo函数内的代码

4、foo函数执行结束，将foo函数执行上下文弹出栈

5、执行fn()函数，创建fn函数(bar)的AO对象，创建fn函数（bar）的函数执行上下文并压入执行上下文栈中

6、fn函数（bar）执行完成，将fn函数（bar）的函数执行上下文弹出栈，垃圾回收器销毁bar函数的AO对象

注意：在此之前，是存在内存泄漏的，因为foo函数执行结束了，但是foo函数的AO对象并没有被销毁（因为有bar函数对象指向它）。foo函数的AO对象是应该被销毁的但没被销毁，所以说存在内存泄露！

7、执行fn = null，由于fn变量指向null，bar函数的AO对象没有任何变量指向，所以垃圾回收器会销毁bar函数的AO对象

8、由于bar函数的AO对象被垃圾回收器销毁，foo函数的AO对象没有任何变量指向，也会被垃圾回收器销毁

9、指向foo = null，foo变量指向null，不再指向foo函数对象

10、由于foo函数对象没有任何变量指向，所以会被垃圾回收器销毁

AO不使用的属性

我们来研究一个问题：AO对象不会被销毁时，是否里面的所有属性都不会被释放？

下面这段代码中name属于闭包的父作用域里面的变量； 我们知道形成闭包之后count一定不会被销毁掉，那么name是否会被销毁掉呢？ 这里我打上了断点，我们可以在浏览器上看看结果；

function foo(count) {
          
   
  let name = "fuyou"
  return function (num) {
          
   
    debugger
    return count + num
  }
}

const add10 = foo(10)
console.log(add10(5))
console.log(add10(8))

在debugger时候，我们可以发现，AO不使用的属性name是会被销毁的。