关于前端:简述闭包加速你的理解

53次阅读

共计 1006 个字符,预计需要花费 3 分钟才能阅读完成。

闭包

原文链接:https://note.noxussj.top/?source=sifou

什么是闭包?

闭包的概念并不简单,然而它的定义比拟绕(就像平时常常用到它,却又说不出来是什么)。能够在一个作用域中调用函数的外部函数并拜访到该函数中的作用域的成员,这就是闭包。给一个倡议,网上闭包的概念能够搜进去一大堆,然而你真的理解它吗?你有去调试看过它真的存在吗?始终处于实践状态,没有去真正实际过,这样的常识背下来了也没有太大意义,到面试的时候也表白不分明。

闭包的原理

函数在执行的时候会放到一个执行栈中,当函数执行结束之后会从执行栈移除,然而堆上的作用域成员因为被内部援用不能开释,因而外部函数仍然能够拜访内部函数的成员。

为了更好的了解,我列举以下两个场景,一个是存在闭包,一个是不存在闭包。并且通过浏览器调试工具去查看闭包。


根底案例

场景 1
    function makeFn() {
        let msg = 'Hello function'

        console.log(msg)
    }

    makeFn()

执行过程如下:

  1. 定义 makeFn 函数
  2. 调用 makeFn 函数
  3. 定义 msg 变量
  4. 打印 msg 变量
  5. 销毁 msg 变量
  6. 执行结束

调试后果

从上图中能够看到,当咱们筹备打印 msg 变量的时候,它是从以后作用域读取进去的。

场景 2
    function makeFn() {
        let msg = 'Hello function'

        return function inside() {console.log(msg)
        }
    }

    let fn = makeFn() // 执行 makeFn 函数,返回 inside 函数

    fn() // 执行 inside 函数

执行过程如下:

  1. 定义 makeFn 函数
  2. 调用 makeFn 函数
  3. 定义 msg 变量
  4. 定义 inside 函数(尽管还没被调用,然而因为该函数拜访了内部函数的变量,所以内部函数的执行上文对象不会被销毁,造成闭包)
  5. makeFn 函数执行结束,并将 inside 函数返回给 fn
  6. 调用 fn 函数
  7. inside 函数拜访 msg 变量(从闭包中获取 msg)
  8. 打印 msg 变量
  9. 执行结束

调试后果

从上图中能够看到,当咱们筹备打印 msg 变量的时候,它是从闭包外面读取进去的。

还有一点,闭包会造成内存泄露,这句话不齐全对,何为内存泄露?例如上图的 msg 变量,是我想要拜访的变量,它不叫内存泄露。内存泄露是指在闭包中存在一些我不想要的资源,或者是无意间生成进去的。


原文链接:https://note.noxussj.top/?source=sifou

正文完
 0