美文网首页
关于闭包的理解

关于闭包的理解

作者: bin_lifecycle | 来源:发表于2019-10-16 13:10 被阅读0次
1.对于闭包,个人理解:

有权访问另一个函数作用域中的变量的函数

示例:

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
</head>

<body>
  <script>
    var outerValue = '我是外部变量';
    var later;
    function outerFunction() {
      var innerValue = '我是内部变量';
      var innerFunction = function () {
        console.log(outerValue);
        console.log(innerValue);
      };
      later = innerFunction;
    }
    outerFunction();
    later();
  </script>
</body>

</html>

打印结果

闭包是一种特殊的对象。
它由两部分构成:函数,以及创建该函数的环境。环境由闭包创建时在作用域中的任何局部变量组成。

理解闭包的关键在于:外部函数调用之后其变量对象本应该被销毁,但闭包的存在使我们仍然可以访问外部函数的变量对象,这就是闭包的重要概念。

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
</head>
<body>
  <script>
    let outer;
    function father(){
      let inner = '我是函数的内部变量';
      function child(){
        console.log(inner);
      }
    }
    father();
  </script>
</body>
</html>
打印结果,并没有打印出inner

分析:此时js脚本中,调用了father函数,该函数含有一个内部变量inner,同时在该函数中创建了另一个child函数,child函数可以访问father函数的内部变量,但是child函数在father函数的内部,外部没法直接调用,所以控制台没有打印任何结果

换一下写法:

<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
</head>
<body>
  <script>
    let outer;
    function father(){
      let inner = '我是father函数的内部变量';
      outer = function child(){
        console.log(inner);
      }
    }
    father();
    outer();
  </script>
</body>
</html>
有打印结果

此时有打印结果,因为child函数的引用赋给了一个外部的变量

产生一个闭包
   创建闭包最常见方式,就是在一个函数内部创建另一个函数。下面例子中的 child 就是一个闭包:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
</head>
<body>
  <script>
    function father(){
      let a =1 ,b=2;
      function child(){ //闭包函数,访问外部函数的
        return a+b; //返回father函数内部变量a+b的合
      }
      return child; //返回闭包函数
    }
    console.log(father());
  </script>
</body>
</html>
打印出闭包函数
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
</head>
<body>
  <script>
    function father(){
      let a =1 ,b=2;
      function child(){ //闭包函数,访问外部函数的
        return a+b; //返回father函数内部变量a+b的合
      }
      return child(); //返回闭包函数的执行结果
    }
    console.log(father());
  </script>
</body>
</html>
打印出闭包函数的执行结果

闭包的作用域链包含着它自己的作用域,以及包含它的函数的作用域和全局作用域。

闭包的注意事项

.通常,函数的作用域及其所有变量都会在函数执行结束后被销毁。但是,在创建了一个闭包以后,这个函数的作用域就会一直保存到闭包不存在为止。

相关文章

  • Swift5 闭包及其应用

    关于如何理解闭包 学习闭包的第一个难点就是理解闭包,可能很多人用了很久的闭包都还不太清楚闭包到底是什么,我这里提供...

  • JavaScript - 闭包

    理解 关于闭包 答案: 用arguments.callee和闭包实现的函数封装 应用 利用闭包实现自动递增计数

  • 关于闭包理解

    https://zhuanlan.zhihu.com/p/22486908[https://zhuanlan.zh...

  • 关于闭包的理解

    1.对于闭包,个人理解: 有权访问另一个函数作用域中的变量的函数 示例: 闭包是一种特殊的对象。它由两部分构成:函...

  • 关于闭包的理解

    什么是闭包?闭包是有权限访问其它函数作用域内的变量的一个函数。 在js中,变量分为全局变量和局部变量,局部变量的作...

  • 关于闭包的理解

    参考文章 https://www.cnblogs.com/cxying93/p/6103375.html内容相似,...

  • Gradle开发-Groovy闭包

    # 闭包 闭包的基础知识 闭包的使用 闭包 this,owner,delegate 的理解 总结 ## 闭包的基础...

  • 一分钟理解js闭包

    一分钟理解js闭包,关于js闭包的内容介绍了很多,本文带着大家快速理解什么是js闭包,感兴趣的小伙伴们可以参考一下...

  • 一分钟带你弄懂闭包

    一分钟理解js闭包,关于js闭包的内容介绍了很多,本文带着大家快速理解什么是js闭包,感兴趣的小伙伴们可以参考一下...

  • 什么是闭包?几分钟告诉你

    一分钟理解js闭包,关于js闭包的内容介绍了很多,本文带着大家快速理解什么是js闭包,感兴趣的小伙伴们可以参考一下...

网友评论

      本文标题:关于闭包的理解

      本文链接:https://www.haomeiwen.com/subject/akpymctx.html