编程语言
首页 > 编程语言> > JavaScript-闭包

JavaScript-闭包

作者:互联网

文章目录


一、理解闭包

  1. 如何产生闭包?
    当一个嵌套的内部(子)函数引用了嵌套的外部(父)函数的变量或函数时,就产生了闭包。
  2. 闭包到底是什么?有两种理解:
    绝大多数人:闭包是嵌套的内部函数
    极少数人:闭包是包含被引用变量或函数的对象
  1. 归纳闭包产生的条件:
    (1)函数嵌套。
    (2)内部函数引用外部函数的数据。
    (3)外部函数执行完毕,才会执行内部函数的定义,然后才产生闭包,但并不需要调用内部函数。


二、常见的闭包

  1. 第一种:将内部函数作为外部函数的返回值
    在这里插入图片描述

  2. 第二种:调用函数时,将一个函数作为另一个函数的实参传递
    在这里插入图片描述

三、闭包的作用

  1. 延长变量的生命周期
    使外部函数中定义的局部变量在外部函数执行完毕过后仍然存在与内存中。
  2. 在函数外部操作内部数据
    通过闭包,我们可以在函数外部操作函数内部的变量。

三、闭包的生命周期

  1. 产生
    闭包在嵌套的内部函数的定义语句执行完毕时产生,这里不需要调用内部函数,但必须调用外部函数。
  2. 死亡
    在含有闭包的内部函数成为垃圾对象时,闭包也会被销毁。(即当外部函数的外部没有对该内部函数的引用时,内部函数成为垃圾对象自动释放内存,闭包也会消失)。

四、闭包的应用:自定义JS模块

JS模块是指具有某些特定功能的 js 文件。

特点:

  1. 将所有的数据(变量或对象)和功能(函数)封装到一个函数内部(私有的)。
  2. 只向外暴露一个对象或函数,该对象或函数包含需要操作的特定对象或方法。
  3. 模块的使用者,只需要通过调用模块暴露给外部的对象来调用方法以实现相应功能。
  4. 调用模块函数前需要先引入模块函数。

自定义JS模块:有两种方式

function mymodule(){
    var msg = "my atguigu";
    function doSomething(){
        console.log('doSomething: '+msg.toUpperCase());
    }
    function doOtherthing(){
        console.log('doSomething: '+msg.toLowerCase());
    }
    return{
        doSomething: doSomething,
        doOtherthing: doOtherthing
    }
}
(function(){
    var msg ="My atguigu";
    function doSomething(){
        console.log('doSomething: '+msg.toUpperCase());
    }
    function doOtherthing(){
        console.log('doSomething: '+msg.toLowerCase());
    }
    window.myModule2 = {
        doSomething: doSomething,
        doOtherthing: doOtherthing
    }
})();
<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <!--引入JS模块-->
    <script type="text/javascript" src="./js/myModule.js"></script>
    <script type="text/javascript" src="./js/匿名函数自调用.js"></script>
</head>
<body>
<script>
    //执行模块函数并调用方法
    mymodule().doSomething();
    mymodule().doOtherthing();
    //调用JS模块
    myModule2.doSomething();
    myModule2.doOtherthing();
</script>
</body>
</html>

五、闭包的缺点及解决办法

六、面试题

片段一:没有闭包
在这里插入图片描述
片段二:有闭包
在这里插入图片描述
片段三:
在这里插入图片描述
解题关键:有无产生闭包


(完)

标签:闭包,内部,doSomething,JavaScript,内存,模块,函数
来源: https://blog.csdn.net/qq_53979554/article/details/118241556