javaScript闭包原理和应用

闭包认识:

JavaScript 中的闭包是指一个函数和其相关的变量构成的一个特殊对象。

在 JavaScript 中,每个函数都可以看作是一个闭包,因为函数对于自己所在的作用域具有完整的访问权限。

所谓作用域,就是一段可访问其中定义的变量和函数的代码区域。如果在函数内部定义了另一个函数并返回它,那么该函数就形成了一个闭包。

也就是说,该函数和其相关的变量可以在函数外部被调用和访问

闭包实例:

function add(a) {
  return function(b) {
    return a + b;
  };
}

let sum = add(1)(2);

console.log(sum);  输出3

闭包原理:

为了更好理解闭包,需要先了解 JavaScript 中的 作用域链 词法作用域

作用域:

在 JavaScript 中,作用域链是一种用于确定变量访问权限的机制。

当一个函数被创建时,JavaScript 引擎会为该函数创建一个作用域链。作用域链中包含了当前函数所在的作用域以及所有外层作用域的变量对象。

如果在函数内部访问一个变量,JavaScript 引擎会从当前作用域开始向上查找,直到找到该变量所在的作用域,或者查找到全局作用域为止。

词法作用域:

在 JavaScript 中,词法作用域是指变量的作用域是在代码编写时就确定的,与函数实际执行的位置无关。

变量作用域由当前函数以及所有外层函数的作用域决定。也就是说,函数内部定义的变量无法被函数外部访问,而函数外部定义的变量则可以在函数内部访问。

闭包的优缺点:

优点:

  • 封装变量:使用闭包可以隐藏函数内部的变量和方法,避免变量被全局访问和修改,从而保证代码的安全性和可维护性。
  • 保存状态:由于闭包能够记住其创建时所在的作用域,所以可以用来保存状态,比如追踪函数的调用次数、动态地生成唯一标识符等。

缺点:

  • 内存泄漏:由于闭包会使得一些变量长时间保存在内存中,如果过度使用闭包可能会导致内存泄漏的问题。
  • 性能消耗:由于使用闭包会增加额外的内存开销,因此在需要频繁调用的情况下,过多地使用闭包可能会导致性能下降。

应用场景:

实现模块化:

通过使用闭包,可以将函数内部的变量和方法封装起来,形成一个独立的模块,实现了代码的模块化,从而提高代码的可维护性和可读性。 

const module = (function() {
  // 私有变量
  let privateVariable = "Hello World";

  // 私有方法
  function privateFunction() {
    console.log(privateVariable);
  }

  // 返回公共接口
  return {
    // 公共方法
    publicFunction: function() {
      privateFunction();
    }
  };
})();

// 调用公共方法
module.publicFunction();  输出 "Hello World"

 实现缓存

使用闭包可以保存函数的计算结果,以便下次调用时直接返回结果,避免重复计算和请求,从而提高性能。

function cacheFunction(fn) {
  缓存变量
  let cache = {};

  return function(arg) {
    if (arg in cache) {
      console.log("缓存取数据", arg);
      return cache[arg];
    }
    else {
      console.log("计算并缓存", arg);
      let result = fn(arg);
      cache[arg] = result;
      return result;
    }
  };
}

定义缓存函数
function square(x) {
  return x * x;
}

缓存该函数
const cachedSquare = cacheFunction(square);

第一次调用,计算并缓存
console.log(cachedSquare(2)); 输出 "计算并缓存", 2 和 4

第二次调用,缓存取数据
console.log(cachedSquare(2)); 输出 "缓存取数据", 2 和 4

实现继承

可以使用闭包来实现对象的继承。通过在一个函数内部返回另一个函数,并回调父类的构造函数,就可以实现对象的继承。

function Animal(name) {
  私有变量
  let privateName = name;

  公共接口
  return {
    getName: function() {
      return privateName;
    },
    sayHello: function() {
      console.log("你好" + privateName);
    }
  };
}

function Cat(name) {
  继承自Animal
  let animal = Animal(name);

  私有方法
  function meow() {
    console.log("你调用了私有方法");
  }

  扩展公共接口
  animal.meow = meow;

  返回修改后的公共接口
  return animal;
}

创建Cat 实例
const myCat = Cat("Tom");

使用Animal中的方法
console.log(myCat.getName()); 输出 "Tom"
myCat.sayHello();             输出 "你好Tom"

使用Cat中的方法
myCat.meow();                 输出 "你调用了私有方法"

闭包是 JavaScript 中一种非常强大的特性,它提供了许多方便和强大的功能。

理解闭包的原理和应用场景,不仅能够让代码更加简洁清晰,还能够提高代码的可维护性和性能。需要注意使用闭包时要避免出现内存泄漏和性能消耗问题,合理地使用闭包才能发挥其优点。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值