JS 闭包有哪些经典的使用场景和源代码

闭包在JavaScript中是一个非常强大的特性，经典的使用场景包括数据封装和隐藏、模块化代码、在回调函数中保持状态、创建工厂函数以及实现柯里化（Currying）。闭包允许函数访问并操作函数外部的变量，即使外部函数已经执行完毕。其中，数据封装和隐藏是闭包的一个非常重要的应用，通过闭包可以创建包含私有数据的函数，这些数据不会被外部直接访问，从而模仿类似私有变量的功能。

一、数据封装和隐藏

在JavaScript中，我们可以通过闭包隐藏数据，这样就可以实现类似于"私有变量"的概念。通过这种方式封装的变量，不会被外部直接访问，只可以通过提供的公有方法来间接操作。

function createCounter() {

    let count = 0; // 私有变量
    return {
        increment: function() {
            count++;
        },
        decrement: function() {
            count--;
        },
        getCount: function() {
            return count;
        }
    };
}
const counter = createCounter();
counter.increment();
console.log(counter.getCount()); // 输出 1
counter.decrement();
console.log(counter.getCount()); // 输出 0
// count 不可以直接访问，封装性良好。

二、模块化代码

闭包可以帮助我们更好地模块化代码。例如，我们可以创建模块，将相关的函数和变量组织到一起，只暴露必要的接口，其余的细节都隐藏起来。

var module = (function() {

    var privateVar = 'I am private...';
    return {
        getPrivate: function() {
            return privateVar;
        },
        setPrivate: function(value) {
            privateVar = value;
        }
    };
})();
console.log(module.getPrivate()); // 输出 'I am private...'
module.setPrivate('New value');
console.log(module.getPrivate()); // 输出 'New value'

三、在回调函数中保持状态

闭包也常用在异步操作和回调函数中，可以记住上下文环境中的变量，这样即使异步操作完成后，这些变量依然可以被访问。

function asyncFunction(data, callback) {

    setTimeout(function() {
        callback(data);
    }, 100);
}
var data = 'Data needed in callback.';
asyncFunction(data, function(data) {
    console.log('Callback called! ' + data); // 输出 'Callback called! Data needed in callback.'
});

四、创建工厂函数

闭包允许我们创建工厂函数，这类方法能够返回一个特定功能的函数，这在创建大量类似的函数时非常有用。

function makeAdder(x) {

    return function(y) {
        return x + y;
    };
}
const add5 = makeAdder(5);
console.log(add5(2));  // 输出 7
console.log(add5(3));  // 输出 8
const add10 = makeAdder(10);
console.log(add10(2)); // 输出 12
console.log(add10(3)); // 输出 13

五、实现柯里化（Currying）

柯里化是将一个多参数函数转换成一系列使用单一参数的函数的技术。闭包在这个过程中起到关键作用，它保持了存在于柯里化函数作用域中的变量。

function curry(fn) {

    return function curried(...args) {
        if (args.length >= fn.length) {
            return fn.apply(this, args);
        } else {
            return function(...args2) {
                return curried.apply(this, args.concat(args2));
            }
        }
    };
}
function sum(a, b, c) {
    return a + b + c;
}
const curriedSum = curry(sum);
console.log(curriedSum(1)(2)(3)); // 输出 6
console.log(curriedSum(1, 2, 3)); // 输出 6
console.log(curriedSum(1)(2, 3)); // 输出 6

闭包是JavaScript中一个非常有用且功能强大的特性，上述情境只是它们应用的冰山一角。掌握闭包的使用，能让你的JavaScript代码更加强大和灵活。

相关问答FAQs：

1. 闭包是什么？如何创建闭包？

闭包是指函数可以“记住”并访问其词法作用域，即使在该函数已经执行完毕之后仍然可以访问。在JavaScript中，闭包的创建非常简单，只需在一个函数内部定义另一个函数，并将内部函数作为返回值返回即可。

2. 闭包的经典使用场景是什么？

闭包的经典使用场景包括保存私有变量、模块化开发和事件处理等。通过使用闭包，我们可以创建私有变量，使其在函数外部不可访问，从而保护数据的安全性。此外，闭包还可以帮助我们将代码模块化，将一些变量和函数封装在一个闭包中，避免全局命名空间的污染。最后，闭包还常用于事件处理，例如在循环中创建闭包来保存循环变量的值，实现每个元素都可以正常运行的事件处理函数。

3. 可以给出一些闭包的源代码示例吗？

当然可以。下面是一个简单的闭包示例：

function outerFunc() {
  var outerVar = 'Hello';

  function innerFunc() {
    console.log(outerVar);
  }

  return innerFunc;
}

var closure = outerFunc();
closure(); // 输出: Hello

在这个例子中，outerFunc函数内部定义了innerFunc函数，并将其作为返回值返回。在外部调用outerFunc函数后，将返回的函数赋值给变量closure。在调用closure函数时，由于innerFunc形成了闭包，它可以访问到outerFunc函数的变量outerVar，并输出其值。

最后建议，企业在引入信息化系统初期，切记要合理有效地运用好工具，这样一来不仅可以让公司业务高效地运行，还能最大程度保证团队目标的达成。同时还能大幅缩短系统开发和部署的时间成本。特别是有特定需求功能需要定制化的企业，可以采用我们公司自研的企业级低代码平台：织信Informat。 织信平台基于数据模型优先的设计理念，提供大量标准化的组件，内置AI助手、组件设计器、自动化（图形化编程）、脚本、工作流引擎（BPMN2.0）、自定义API、表单设计器、权限、仪表盘等功能，能帮助企业构建高度复杂核心的数字化系统。如ERP、MES、CRM、PLM、SCM、WMS、项目管理、流程管理等多个应用场景，全面助力企业落地国产化/信息化/数字化转型战略目标。 版权声明：本文内容由网络用户投稿，版权归原作者所有，本站不拥有其著作权，亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容，请联系我们微信：Informat_5 处理，核实后本网站将在24小时内删除。