zoukankan      html  css  js  c++  java
  • 54.闭包有哪些使用场景?优缺点是什么?

    一:什么是闭包?        https://blog.csdn.net/qq_33505829/article/details/86080460

    闭包就是能够读取其他函数内部变量的函数,说白了闭包就是个函数,只不过是处于其他函数内部而已。

    由于在javascript中,只有函数内部的子函数才能读取局部变量,所以说,闭包可以简单理解成“定义在一个函数内部的函数“。

    所以,在本质上,闭包是将函数内部和函数外部连接起来的桥梁。

    知乎大神说:闭包是指在 JavaScript 中,内部函数总是可以访问其所在的外部函数中声明的参数和变量,即使在其外部函数被返回(寿命终结)了之后。

    二:用途是什么?

    1.访问函数内部的变量

    2.防止函数内部的变量执行完城后,被销毁,使其一直保存在内存中。

    写一个关于闭包的例子:

    function outer(x) {

    // 参数相当于局部的变量

        function inner(y) {

           console.log(x + y);

    }

       return inner;

    }

    var closure = outer(3);

    closure(7); // 输出10

    inner函数把自己内部的语句,和自己在声明时所处的作用域一起封装成了一个密闭的环境,我们就称之为闭包。

    函数本身就是一个闭包,函数在定义的时候,就能记住自己的外部环境和内部语句,每次执行的时候,会参考定义时的密闭环境。

    关于闭包的用处的例子:看的MDN网站上的例子,讲的非常清楚了

    var makeCounter = function() {
      var privateCounter = 0;
      function changeBy(val) {
        privateCounter += val;
      }
      return {
        increment: function() {
          changeBy(1);
        },
        decrement: function() {
          changeBy(-1);
        },
        value: function() {
          return privateCounter;
        }
      }  
    };

    var Counter1 = makeCounter();
    var Counter2 = makeCounter();
    console.log(Counter1.value()); /* logs 0 */
    Counter1.increment();
    Counter1.increment();
    console.log(Counter1.value()); /* logs 2 */
    Counter1.decrement();
    console.log(Counter1.value()); /* logs 1 */
    console.log(Counter2.value()); /* logs 0 */

    每次调用其中一个计数器时,通过改变这个变量的值,会改变这个闭包的词法环境。然而在一个闭包内对变量的修改,不会影响到另外一个闭包中的变量。以这种方式使用闭包,提供了许多与面向对象编程相关的好处 —— 特别是数据隐藏和封装。

    缺点:

    如果不是某些特定任务需要使用闭包,在其它函数中创建函数是不明智的,因为闭包在处理速度和内存消耗方面对脚本性能具有负面影响。

    实际项目应用:

    封装一个公共弹框,点击确定取消按钮,会触发退订事件,调用退订接口,成功之后还会刷新列表。

    弹框组件接受一个 确定按钮的事件,OK参数。

    如果 OK 不写成箭头函数,那么里面的this 指向的是OK 而不是vue ,就无法执行,methods 的方法,也可以 在外部

    let _this = this;

    ok: function() {

    _this.exitOrder();

    }

    这么写也可以。

  • 相关阅读:
    codechef FNCS
    bzoj2653 middle
    CF698F Coprime Permutation
    CF538H Summer Dichotomy
    CF930E Coins Exhibition
    CF468D Tree
    CF528E Triangles3000
    BZOJ 4066: 简单题
    BZOJ 4300: 绝世好题
    BZOJ 4520: [Cqoi2016]K远点对
  • 原文地址:https://www.cnblogs.com/dream111/p/13472725.html
Copyright © 2011-2022 走看看