闭包系列：揭开闭包 8 种形式的神秘面纱

在 JavaScript 中，闭包是指可以访问外部函数作用域的函数。这种特性使闭包非常强大，因为它允许函数在执行之后仍然访问其创建时的作用域。闭包通常用于创建私有变量和方法，以及实现函数 currying 和延迟执行等功能。

在本文中，我们将探讨闭包的八种形式。每种形式都有其独特的特点和用途，掌握这些形式将使您能够更有效地利用闭包。

1. 传统闭包

传统闭包是指将内部函数定义在外部函数内部，并将其作为返回值返回。这种形式的闭包通常用于创建私有变量和方法。

function outerFunction() {
  let privateVariable = 10;

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

  return innerFunction;
}

const inner = outerFunction();

inner(); // 10

2.立即执行函数表达式 (IIFE)

IIFE 是闭包的另一种常见形式，它是一种将函数表达式立即执行的技巧。IIFE 通常用于创建私有变量和方法，以及实现单例模式。

(function() {
  let privateVariable = 10;

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

  innerFunction();
})(); // 10

3.模块

模块是 JavaScript 中的闭包，它可以将代码组织成独立的块。模块可以包含函数、变量和其他模块，并且可以导出和导入。模块通常用于创建可重用组件和库。

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

export const PI = 3.14;

import { add, PI } from './module.js';

const result = add(1, 2);
console.log(result); // 3

4.箭头函数

箭头函数是 ES6 中引入的一种新的函数语法。箭头函数也是闭包，并且可以访问其创建时的作用域。箭头函数通常用于创建回调函数和简化代码。

const numbers = [1, 2, 3, 4, 5];

const doubledNumbers = numbers.map(number => number * 2);

console.log(doubledNumbers); // [2, 4, 6, 8, 10]

5.柯里化函数

柯里化函数是指将一个多参数函数转换为一系列单参数函数的技术。柯里化函数通常用于创建可重用组件和库。

const add = (a, b) => a + b;

const addOne = add.bind(null, 1);

const result = addOne(10);

console.log(result); // 11

6.延迟执行函数

延迟执行函数是指将函数的执行延迟到一定时间后才执行。延迟执行函数通常用于实现动画效果和延迟加载。

setTimeout(() => {
  console.log('Hello, world!');
}, 1000);

7.事件处理函数

事件处理函数是闭包的另一种常见形式。事件处理函数是指响应用户事件的函数，例如点击、鼠标移动和键盘输入。事件处理函数通常用于创建交互式 web 应用程序。

document.getElementById('button').addEventListener('click', () => {
  console.log('Button clicked!');
});

8.生成器函数

生成器函数是 JavaScript 中的闭包，它可以返回一个可迭代的对象。生成器函数通常用于创建迭代器和惰性求值。

function* generateNumbers() {
  let i = 0;

  while (true) {
    yield i++;
  }
}

const numbers = generateNumbers();

for (const number of numbers) {
  console.log(number);

  if (number >= 10) {
    break;
  }
}