当前位置：首页 > news >正文

JS—闭包：3分钟从入门到放弃

news 来源：原创 2025/8/20 18:13:48

个人博客：haichenyi.com。感谢关注

一. 目录

一–目录
二–基础定义
三–闭包的运行机制
四–闭包实战应用场景
五–内存泄漏预防指南
六–最佳实践总结

二. 基础定义

闭包：能够访问外部函数作用域的函数，以及其词法环境的组合。举个老生常谈栗子：

function createCounter() {let count = 0; // 被闭包捕获的变量return function() {//内部大括号count += 1;return count;};
}const counter = createCounter();
console.log(counter()); // 1
console.log(counter()); // 2

解析一下上面这段代码：

上面这个例子，有两个方法，一个是外部的createCounter方法，一个是内部的return 的方法。
外部createCounter方法定义了一个变量count
内部return的方法，使用了这个变量，让这个变量+1，然后返回。
我们都知道内部可以访问外部变量，这是没有问题的。反过来，外部不能访问内部变量(var除外)
我们再来说这个概念。
a. 访问外部函数作用域的函数，指的就是上面例子中的return返回的函数
b. 词法环境，简单的理解就是作用域，也就是两个大括号之间的东西(不够严谨，可以简单的这么理解)

三. 闭包的运行机制

3.1 词法作用域链

function outer() {const x = 10;function inner() {console.log(x); // 访问父作用域的x}return inner;
}

函数定义时确定作用域链
闭包在outer执行结束后依然保留对x的访问

3.2 内存模型解析

function createClosure() {const bigData = new Array(1000000); // 大数据return () => console.log(bigData.length);
}const closure = createClosure();

闭包持有对父作用域整个变量对象的引用
错误的闭包使用会导致bigData无法被GC回收

四. 闭包实战应用场景

4.1 模块模式（现代ES6替代方案export,import）

const calculator = (() => {let memory = 0;return {add: (x) => memory += x,reset: () => memory = 0};
})();calculator.add(5); // 5
calculator.reset();

对标ES6的export，import

//tool.js
let memory = 0
export function add(x) {return memory +x
}
export function reset() {memory =0
}
//在需要用的位置import tool.js文件的add和reset两个方法即可

五. 内存泄漏预防指南

5.1 常见泄漏场景

DOM元素引用

function createClosure() {const element = document.getElementById('bigElement');return () => {console.log(element.offsetWidth);};
}

未清理的定时器

function startTimer() {const data = fetchData();setInterval(() => {process(data); // data被长期持有}, 1000);
}

5.2 优化策略

解除引用：在不再需要时手动置null

function cleanClosure() {let data = /* ... */;const cleanup = () => {data = null;};return { processData, cleanup };
}

使用WeakMap/WeakRef

const weakCache = new WeakMap();function cacheData(element, data) {weakCache.set(element, data);
}

事件监听器管理

function setupListeners() {const handler = () => {/* ... */};element.addEventListener('click', handler);return () => {element.removeEventListener('click', handler);};
}

六. 最佳实践总结

最小化闭包作用域
- 只保留必要的变量
- 及时解除无用引用
优先使用块级作用域

//在类似于这种循环时，使用let，const，不要使用var
for (let i = 0; i < 10; i++) {setTimeout(() => console.log(i), 100);
}

模块化代码结构

// ES Modules
export const createClosure = () => { /* ... */ };
//也就是使用ES6的export 和 import

配合垃圾回收机制：避免循环引用；使用WeakMap代替普通对象

JS—闭包：3分钟从入门到放弃

个人博客：haichenyi.com。感谢关注一. 目录一–目录二–基础定义三–闭包的运行机制四–闭包实战应用场景五–内存泄漏预防指南六–最佳实践总结二. 基础定义闭包：能够访问外部函数作用域的函数，以及其词法环境的组合。举个老生常谈栗…...

编程日记 2025/8/20 18:13:48

python pandas模块

python pandas模块终于也到介绍pandas的时候了，python中用于处理data的一个lib 从wiki中找到的关于pandas的介绍，如下， Original author(s) Wes McKinney Developer(s) Community Initial release 11 January 2008; 17 years ago [citatio…...

编程日记 2025/8/17 4:05:34

系统部署【信创名录】及其查询地址

一、信创类型 （一）服务器： 1.华为云 2.腾讯云 3.阿里云 （二）中央处理器（CPU）： 1.海思，鲲鹏920服务器 （三）中间件 1.人大金仓 &#xff0…...

编程日记 2025/8/20 4:09:46

前言 MongoDB 使用 keyFile 进行节点间身份验证，我们需要先创建一个 keyFile 并确保所有副本集的节点使用相同的 keyFile。 openssl rand -base64 756 > mongo-keyfile chmod 400 mongo-keyfiledocker-compose部署分片集群无密码方式 # docker-compose-mongodb.yml s…...

编程日记 2025/8/17 16:41:51

博奥龙Nanoantibody系列IP专用抗体

货号名称BDAA0260 HRP-Nanoantibody anti Mouse for IP BDAA0261 AbBox Fluor 680-Nanoantibody anti Mouse for IP BDAA0262 AbBox Fluor 800-Nanoantibody anti Mouse for IP ——无轻/重链干扰，更高亲和力和特异性 01Nanoantibody系列抗体是利用噬菌体展示纳…...

编程日记 2025/8/20 1:20:35

CTFshow 【WEB入门】信息搜集【VIP限免】 web1-web17

CTFshow 【 WEB入门】、【VIP限免】 web1 ----源码泄露首先第一步，看源代码 web2----前台JS绕过简单点击查看不了源代码，可以强制查看比如 Ctrl Shift ICtrl U或者在url前加一个view-source: view-source:http://79999ca1-7403-46da-b25b-7ba9…...

编程日记 2025/8/16 12:31:52

css 知识点整理

1.css 层叠样式表中的 inherit、initial、unset 关键字适用属性类型行为逻辑典型场景inherit所有属性强制继承父级值统一子元素样式initial所有属性重置为规范初始值清除自定义或继承样式unset所有属性自动判断继承或重置简化全局样式重置或覆盖 2. sass 常用语法 2.1、变量…...

编程日记 2025/8/16 4:59:02

02.Kubernetes 集群部署

Kubernetes 集群部署 Kubernetes 相关端口 1. Kubernetes 集群组件运行模式独立组件模式除 Add-ons 以外，各关键组件以二进制方式部署于节点上，并运行于守护进程；各 Add-ons 以 Pod 形式运行静态 Pod 模式控制平面各组件以静态 Pod …...

编程日记 2025/8/16 11:37:59

支持向量机（SVM）原理与应用

背景支持向量机（Support Vector Machine, SVM）是一种经典的监督学习算法，广泛应用于分类和回归问题。SVM以其强大的数学基础和优异的性能在机器学习领域占据了重要地位。本文将详细介绍SVM的原理、核函数的作用以及如何在Python中使用SVM解决…...

编程日记 2025/8/20 17:40:38

【文献阅读】SPRec：用自我博弈打破大语言模型推荐的“同质化”困境

📜研究背景在如今的信息洪流中，推荐系统已经成为了我们生活中的“贴心小助手”，无论是看电影、听音乐还是购物，推荐系统都在努力为我们提供个性化的内容。但这些看似贴心的推荐背后，其实隐藏着一个严重的问题——同质…...

编程日记 2025/8/16 12:53:35

【WRF模拟】如何查看 WPS 的输入静态地理数据（二进制格式）？

查看 WPS 的输入静态地理数据方法总结方法 1：使用 gdal_translate 将二进制数据转换为 GeoTIFFgdal_translate 工具概述使用 gdal_translate 将二进制数据转换为 GeoTIFF方法 2：使用 ncdump 查看 geo_em.dXX.nc方法 3：使用 Python xarray + matplotlib 可视化 geo_em.dXX.n…...

编程日记 2025/8/20 22:57:09

介绍如何使用RDDM（残差噪声双扩散模型）进行知识蒸馏

下面为你详细介绍如何使用RDDM（残差噪声双扩散模型）进行知识蒸馏，从而实现学生RDDM模型的一步去噪。这里假定你已经有了RDDM模型，并且使用PyTorch深度学习框架。整体思路数据准备：加载训练数据并进行必要的预处理。…...

编程日记 2025/8/20 10:12:27

【lf中的git实战】

1)开发分支 develop 2)各种功能分支 author/feature_func 3)release分支 4)合并author/feature_func到develop author/feature_func 到 develop时: cd develop git merge --squash author/feature_func 5)develop合并到author/feature_func时: cd author/feature_func g…...

编程日记 2025/8/16 12:46:42

Java实现Consul/Nacos根据GPU型号、显存余量执行负载均衡

Java实现Consul/Nacos根据GPU型号、显存余量执行负载均衡步骤一：服务端获取GPU元数据 1. 添加依赖在pom.xml中引入Apache Commons Exec用于执行命令： <dependency><groupId>org.apache.commons</groupId><artifactId>comm…...

编程日记 2025/8/16 11:57:37

编译支持 RKmpp 和 RGA 的 ffmpeg 源码

一、前言 RK3588 支持VPU硬件解码，需要rkmpp进行调用；支持2D图像加速，需要 RGA 进行调用。这两个库均能通过 ffmpeg-rockchip 进行间接调用，编译时需要开启对应的功能。二、依赖安装编译ffmpeg前需要编译 rkmpp 和 RGA&#xf…...

编程日记 2025/8/20 21:51:09

布隆过滤器（Bloom Filter）

布隆过滤器是一种概率型数据结构，用于快速判断一个元素是否可能在集合中存在。它的核心特点是： 节省空间：相比哈希表，布隆过滤器占用的存储空间非常小。高效查询：查询时间复杂度为 (O(k))，其中 (k) 是哈希…...

编程日记 2025/8/18 1:53:04

2025-03-10 学习记录--C/C++-C语言易错点大总结

C语言易错点大总结一、strlen(strs) 使用错误 ⭐️ 若strs 是一个指针数组（const char* strs[]），则不可用strlen(strs) 计算 strs 的长度，因为 strlen 是用于计算字符串的长度，而不是数组的长度。解决方法 &…...

编程日记 2025/8/18 17:56:53

康谋应用 | 基于多传感器融合的海洋数据采集系统

在海洋监测领域，基于无人艇能够实现高效、实时、自动化的海洋数据采集，从而为海洋环境保护、资源开发等提供有力支持。其中，无人艇的控制算法训练往往需要大量高质量的数据支持。然而，海洋数据采集也面临数据噪声和误差、数据融合…...

编程日记 2025/8/16 9:51:59

SpringMVC （二）请求处理

目录章节简介一请求处理（初级） eg:请求头二请求处理（进阶） eg:请求体三获取请求头四获取Cookie 五级联封装六使用RequestBoby封装JSON对象七文件的上传八获取整个请求 HttpEntity 九原生请求 Spring…...

编程日记 2025/8/19 9:01:25

数据结构——单链表list

前言：大家好😍，本文主要介绍数据结构——单链表目录一、单链表二、使用步骤 1.结构体定义 2.初始化 3.插入 3.1 头插 3.2 尾插 3.3 按位置插四.删除 4.1头删 4.2 尾删 4.3 按位置删 4.4按值删五统计有效值个数六销毁…...

编程日记 2025/8/18 22:41:25

课程《Deep Learning Specialization》

在coursera上，Deep Learning Specialization 课程内容如下图所示： Week2 assignment, Logistic Regression....

编程日记 2025/8/19 9:26:45

低版本 Linux 系统通过二进制方式升级部署高版本 Docker

一、背景： 在一些 Linux 系统中，由于系统自带的软件源版本较低，或者因网络、权限等限制无法直接通过源文件来升级到最新版本的 Docker。这种情况下，采用二进制方式升级部署高版本 Docker 就成为一种有效的解决方案。下面将详…...

编程日记 2025/8/19 18:55:32

线索二叉树构造及遍历算法

线索二叉树构造以及遍历算法线索二叉树（中序遍历版）构造线索二叉树构造双向线索链表遍历中序线索二叉树线索二叉树（中序遍历版） 中序遍历找到对应结点的前驱（土方法） #mermaid-svg-eunGO5d2GhjLxCn5 {fo…...

编程日记 2025/8/15 14:24:28

3. 自定义类型****

目录 1. 内存对齐（必考） 如何计算？ 为什么要内存对齐？ 2. 联合 2.1 联合的定义 2.2 联合的特点 1. 内存对齐（必考） 结构体内存对齐是一个特别热门的考点。如何计算？ 第一个成员在与结构…...

编程日记 2025/8/18 7:16:10

Redis Sentinel (哨兵模式)深度解析：构建高可用分布式缓存系统的核心机制

一、传统主从复制的痛点在分布式系统架构中，Redis 作为高性能缓存和数据存储解决方案，其可用性直接关系到整个系统的稳定性。传统的主从复制架构虽然实现了数据冗余，但在面临节点故障时仍存在明显缺陷： 手动故障转移&#xf…...

编程日记 2025/8/16 9:49:28

deepseek本地部署

deepseek本地部署哈喽，兄弟们！大家可以想象一下，如果有一个超级聪明的人机大脑，能帮你解答任何问题，从复杂的数学难题到编程代码，再到那些让你头疼的写作任务，它都能轻松搞定。这不是科幻电影里的场景，而是DeepSeek带来的现实奇迹！DeepSeek，这个名字听起来就充满了…...

编程日记 2025/8/16 9:49:29

责任链模式的C++实现示例

核心思想责任链模式是一种行为设计模式，允许多个对象都有机会处理请求，从而避免请求的发送者与接收者之间的耦合。请求沿着处理链传递，直到某个对象处理它为止。解决的问题解耦请求发送者与处理者：请求的发送者无需知道具…...

编程日记 2025/8/18 13:49:38

【蓝桥杯python研究生组备赛】003 贪心

题目1 股票买卖给定一个长度为 N 的数组，数组中的第 i 个数字表示一个给定股票在第 i 天的价格。设计一个算法来计算你所能获取的最大利润。你可以尽可能地完成更多的交易（多次买卖一支股票）。注意：你不能同时参与多笔交易&…...

编程日记 2025/8/19 6:00:48

Banana Pi 与瑞萨电子携手共同推动开源创新:BPI-AI2N

2025年3月11日， Banana Pi 开源硬件平台很高兴宣布，与全球知名半导体解决方案供应商瑞萨电子（Renesas Electronics）正式达成技术合作关系。此次合作标志着双方将在开源技术、嵌入式系统和物联网等领域展开深度合作，为全…...

编程日记 2025/8/16 9:51:25

【算法工具】HDL: 基于摘要统计数据的高维连锁不平衡分析软件

## 前言在基因组研究中，连锁不平衡(Linkage Disequilibrium, LD)分析是理解遗传变异之间关联的关键步骤。然而，当面对高维数据时，传统分析方法往往面临巨大计算挑战。今天为大家介绍一款强大的工具——HDL (High-Dimensional Linkage diseq…...

编程日记 2025/8/15 14:50:32

虚拟展览馆小程序：数字艺术与文化展示的新形式探索

虚拟展览馆小程序：数字艺术与文化展示的新形式探索一、传统展览的痛点：物理空间的局限与数字化的必然在传统的艺术与文化展览中，观众往往需要跨越地理距离、排队数小时才能进入展馆，而许多珍贵展品因保护需求无法长期展出。数据显示，全球90%以上的博物馆藏品常年沉睡于…...

编程日记 2025/8/20 13:27:08

docker 搭建alpine下nginx1.26/mysql8.0/php7.4环境

docker 搭建alpine下nginx1.26/mysql8.0/php7.4环境 docker-compose.yml services:mysql-8.0:container_name: mysql-8.0image: mysql:8.0restart: always#ports:#- "3306:3306"volumes:- ./etc/mysql/conf.d/mysql.cnf:/etc/mysql/conf.d/mysql.cnf:ro- ./var/log…...

编程日记 2025/8/20 16:34:25

java项目之基于ssm的在线学习系统（源码+文档）

项目简介在线学习系统实现了以下功能： 该系统可以实现论坛管理，通知信息管理，学生管理，回答管理，教师管理，教案管理，公告信息管理，作业管理等功能。 💕💕作…...

编程日记 2025/8/19 2:30:19

macOS 安装配置 iTerm2 记录

都说 macOS 里替换终端最好的就是 iTerm2 ，这玩意儿还是开源的，所以就也根风学习一下，但全是英文的挺麻烦，所以这里记录一下自己的设置，以最简单的安装及设置为主，想要更酷炫、更好看的还请自己百度吧&…...

编程日记 2025/8/16 9:50:13

矩阵分析-浅要理解（深度学习方向）

梯度分析与最优化在深度学习的任务中，我们所期望的是训练一个神经网络，使得预测结果与真实标签之间的误差最小化，这可以近似看作是一个提供梯度下降等优化找到全局最优解的凸优化问题。奇异值分解在信息工程领域，对数据处理的…...

编程日记 2025/8/19 23:18:12

Odoo 18 中的自动字段和预留字段

Odoo 18 中的自动字段和预留字段作为一个开源平台，Odoo 的价值在于其使用和开发的灵活性、可扩展性和经济性。虽然 Odoo 本身主要用 Python 和 JavaScript 编写，但其作为开源 ERP 系统的价值超越了特定编程语言的范畴，为各行各业的企业提供了…...

编程日记 2025/8/19 4:17:22

【操作系统安全】任务1：操作系统部署

目录一、VMware Workstation Pro 17 部署二、VMware Workstation 联网方式三、VMware 虚拟机安装流程四、操作系统介绍五、Kali 操作系统安装六、Windows 系统安装七、Windows 系统网络配置八、Linux 网络配置 CSDN 原创主页：不羁https://blog.csd…...

编程日记 2025/8/18 3:12:06

Linux：自动化构建-make/Makefile

1.背景一个工程中的源文件不计数，其按类型、功能、模块分别放在若干个目录中，makefile定义了一系列的规则来指定，哪些文件需要先编译，哪些文件需要后编译，哪些文件需要重新编译，甚至于进行更复杂的功能操作…...

编程日记 2025/8/20 17:11:56

maven wrapper的使用

写在前面考虑这样的场景，张三创建了一个maven项目使用了3.9版本，当李四下载下来去开发配置的却是3.6版本，此时李四就不得不再去配置一个3.9版本的maven，为了解决这个问题，maven引入了maven wrapper的机制&#xff08…...

编程日记 2025/8/20 2:34:04

DB-GPT-0.7版本win11安装，最新版本，安装方式变更了

之前两天折腾要死，只因为安装了旧版本问题太多，现在安装最新版本快速开始_V0.7.0 语雀 DB-GPT 0.7.0 部署教程 - yyhhyys blog DB-GPT 0.7.0 与 DeepSeek 集成使用指南 - yyhhyys blog 首先代码结构换了，python包管理工作也换了&#xf…...

编程日记 2025/8/18 13:49:51

树莓集团落子海南，如何重构数字产业生态体系

树莓集团在海南的布局，是其整体商业战略中的关键一环。这背后，是对政策机遇、产业协同、以及区域优势的深度考量。政策机遇海南自贸港建设带来前所未有的政策红利，包括贸易、投资、资金等方面的自由便利。树莓集团紧抓这一机遇&#xff0…...

编程日记 2025/8/16 12:51:34

Spring Boot 项目部署启动异常问题分析与解决：主类缺失与依赖冲突的分析

Spring Boot 项目部署启动异常问题分析与解决在近期的 Spring Boot 项目部署工作中，遭遇了一起典型的启动异常状况。经过多维度的深入排查以及细致的调试，最终确定问题的根源在于打包插件配置与依赖管理的综合影响。以下将详细阐述整个问题的分析过程以及对应的解决办法。 …...

编程日记 2025/8/16 12:25:37

共享内存(System V)——进程通信

个人主页：敲上瘾-CSDN博客进程通信： 匿名管道：进程池的制作（linux进程间通信，匿名管道... ...）-CSDN博客命名管道：命名管道——进程间通信-CSDN博客目录一、共享内存的原理二、信道的建立 …...

编程日记 2025/8/20 12:13:24

考研数学非数竞赛复习之Stolz定理求解数列极限

在非数类大学生数学竞赛中，Stolz定理作为一种强大的工具，经常被用来解决和式数列极限的问题，也被誉为离散版的’洛必达’方法，它提供了一种简洁而有效的方法，使得原本复杂繁琐的极限计算过程变得直观明了。本文&#x…...

编程日记 2025/8/17 14:21:23

12 DHCP的内容和HTTP的改良

一、回顾计算机分配相关身份网络号、主机号网络号内的主机识别局部网通信网关不同网络的通信DNS服务器域名解析因特网通信二、DHCP协议建议学习前看这个视频，14分钟，所有的知识点都有，很容易理解 1、理解 DHCP 的全称是 Dynam…...

编程日记 2025/8/19 7:16:08

多光谱相机数据采集过程中常见仪器

1.BF1515多光谱相机 2.VIX-N220推扫式可见光近红外高光谱相机覆盖光谱范围：400-1000nm； 光谱分辨率：2nm； 设备配套软件：VIX-N220、XuanDo(用于调节相机推扫速度)； 镜头调节所需材料：黑色条…...

编程日记 2025/8/16 11:29:38

【调研】olmOCR解析PDF

测试用例： olmOCR GOT-OCR 将最底下没有文字的部分，可能是样式解析出重复 olmOCR GOT-OCR 无重复重复速度上，olmOCR效果更快效果上，olmOCR解析得到的内容排版更加清晰整齐，而且对于6份GOT-OCR有重复的测…...

编程日记 2025/8/16 9:51:56

蓝桥杯随笔练——二分模板

答案 #include <bits/stdc.h> //洛谷2249 using namespace std;const int N 1e610; int n,m; int a[N];int Array_Search(int a[],int len,int x) {int L 0,R len1;while(L1 < R){int mid (RL) >> 1;if(a[mid] < x ) L mid;else R mid;}if(a[R] x) r…...

编程日记 2025/8/18 22:35:10

【Golang】第三弹----运算符

笔上得来终觉浅,绝知此事要躬行 🔥 个人主页：星云爱编程 🔥 所属专栏：Golang 🌷追光的人，终会万丈光芒 🎉欢迎大家点赞👍评论📝收藏⭐文章一、运算符介绍运算符是一…...

编程日记 2025/8/16 9:49:49

MongoDB 聚合管道速成教程

一、引言 MongoDB 的聚合管道（Aggregation Pipeline）是一种强大的数据处理工具，它允许你对文档进行一系列的操作，如过滤、转换、分组和聚合等。聚合管道由多个管道组成，每个管道对输入的文档进行特定的处理&#xff0…...

编程日记 2025/8/17 10:41:57