JavaScript闭包原理与用法实例分析

什么是闭包

在javascript中，闭包是一个比较基础的概念。它能够让我们可以轻松地实现许多常见的编码模式，比如惰性加载、模块化、私有变量等等。闭包是指有权访问另一个函数作用域内变量的函数。

闭包的原理

闭包创建时，外部函数已经执行完毕，但内部函数仍然可以访问外部函数的变量。因为当一个函数被执行完毕后，它的作用域链并不会立刻被销毁，只有当内部函数被销毁后，整个作用域链才会被销毁。

一个典型的闭包例子如下：

function outerFunction() {
  var outerValue = '外部变量';

  function innerFunction() {
    console.log(outerValue);
  }

  return innerFunction;
}

var innerFn = outerFunction(); // innerFunction被赋值给变量innerFn
innerFn(); // "外部变量"

一个函数返回内部函数，该内部函数仍然可以访问外部函数的变量outerValue，这就是闭包的原理。

闭包的用法

闭包在实际开发中有很多用法，以下是两种常见的用法。

1. 实现模块化

使用闭包实现模块化是常见的做法，它可以有效解决全局变量污染的问题。

var module = (function() {
  var count = 0;

  function getCounter() {
    return count++;
  }

  return {
    getCounter: getCounter
  };
})();

console.log(module.getCounter()); // 0
console.log(module.getCounter()); // 1

2. 实现记忆化函数

记忆化函数可以避免重复计算，提高函数执行效率。以下是使用闭包实现记忆化函数的例子。

function memoize(fn) {
  var cache = {};

  return function() {
    var argStr = JSON.stringify(arguments);
    cache[argStr] = cache[argStr] || fn.apply(fn, arguments);
    return cache[argStr];
  };
}

function heavyTask(x, y) {
  console.log('calculation performed');
  return x * y;
}

var memoized = memoize(heavyTask);

console.log(memoized(4, 5)); // "calculation performed", 20
console.log(memoized(4, 5)); // 20
console.log(memoized(4, 6)); // "calculation performed", 24
console.log(memoized(4, 6)); // 24

在上述例子中，memoize函数返回一个新的函数，该函数在运行时会检查是否已经计算过该组参数并将结果缓存在cache对象中供下次使用。