当前位置: 首页 > article >正文

Javascript的闭包有哪些应用?

JavaScript 中的闭包是一种强大的特性,它可以用于多种应用。以下是一些闭包在 JavaScript 中的常见应用:

1、封装私有变量: 通过闭包,可以创建私有变量和方法。外部作用域无法直接访问闭包内的变量,从而实现了信息隐藏和封装。

function createCounter() {
    let count = 0;
    return function() {
        count++;
        return count;
    };
}

const counter = createCounter();
console.log(counter()); // 1
console.log(counter()); // 2

2、模块模式: 使用闭包可以创建模块,将相关的功能组织在一起,同时保持内部状态的私有性。

const Module = (function() {
    let privateVar = 0;

    function privateFunction() {
        // ...
    }

    return {
        publicVar: 1,
        publicFunction: function() {
            privateVar++;
            return privateFunction();
        }
    };
})();

console.log(Module.publicVar); // 1
console.log(Module.publicFunction()); // Result of privateFunction

3、事件处理程序: 在事件处理程序中使用闭包,可以保持对外部作用域的状态引用,而无需全局变量。

function setupEventListener() {
    let count = 0;

    document.getElementById('myButton').addEventListener('click', function() {
        count++;
        console.log(`Button clicked ${count} times.`);
    });
}

setupEventListener();

4、回调函数: 闭包经常用于创建回调函数,保存对外部函数作用域的引用,以便在稍后调用。

function doSomethingAsync(callback) {
    setTimeout(function() {
        console.log('Async operation completed.');
        callback();
    }, 1000);
}

doSomethingAsync(function() {
    console.log('Callback executed.');
});

5、实现函数记忆: 闭包可以用于缓存函数的结果,以提高性能。这通常用于递归函数或计算昂贵的操作。

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

    return function(...args) {
        const key = JSON.stringify(args);
        if (!cache[key]) {
            cache[key] = fn(...args);
        }
        return cache[key];
    };
}

const memoizedAdd = memoize(function(x, y) {
    console.log('Calculating sum...');
    return x + y;
});

console.log(memoizedAdd(2, 3)); // Calculating sum... 5
console.log(memoizedAdd(2, 3)); // 5 (from cache)

这些只是 JavaScript 中闭包的一些常见用法。闭包的灵活性使得它在许多不同的上下文中都能够发挥作用。


http://www.kler.cn/a/145441.html

相关文章:

  • 二十三种设计模式-享元模式
  • 基于ESP32的桌面小屏幕实战[6]:环境搭建和软件基础
  • 【数据结构】_以SLTPushBack(尾插)为例理解单链表的二级指针传参
  • 使用vscode + Roo Code (prev. Roo Cline)+DeepSeek-R1使用一句话需求做了个实验
  • Spring WebFlux
  • 第十五届蓝桥杯大赛软件赛省赛C/C++ 大学 B 组
  • 城市NOA加速落地,景联文科技高质量数据标注助力感知系统升级
  • 【公网远程手机Android服务器】安卓Termux搭建Web服务器
  • 电商又有大动静,又一短视频进军电商领域!
  • CountDownLatch实战应用——批量数据多线程协调异步处理(子线程执行事务回滚)
  • (离散数学)命题逻辑推理二:间接推理
  • 【Python爬虫实战项目】ip代理池项目原理及代码解析
  • 使用Pytorch从零开始构建Conditional PixelCNN
  • docker环境安装
  • Pycharm创建项目新环境,安装Pytorch
  • Linux安装jdk8【十分丝滑】
  • webpack配置完热更新之后还是会刷新整个页面
  • 思维模型 古烈治效应
  • 数据结构 / 顺序表操作 / 顺序表堆区申请内存
  • CDA一级备考思维导图
  • 物联网中基于信任的安全性调查研究:挑战与问题
  • [设计模式] 常见的设计模式
  • 批量将本地N个英文Html文档进行中文翻译-源码篇
  • MySQL 8 手动安装后无法启动的问题解决
  • Unity SRP 管线【第三讲:URP 光照】
  • Node.js 中的事件驱动架构