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

JavaScript相关(二)——闭包

了解闭包的前提必须得了解什么是作用域链。也就是(一)的内容。

参考:
浏览器工作原理与实践
破解前端面试:从闭包说起

闭包

闭包是一个可以访问外部作用域中变量的内部函数,因为内部函数引用了外部函数的变量,导致这些变量无法被回收,将持久保存在作用域内,这就形成了一个闭包。
这些被引用的变量直到闭包被销毁时才会被销毁。

在 JavaScript 中,根据词法作用域的规则,内部函数总是可以访问其外部函数中声明的变量,当通过调用一个外部函数返回一个内部函数后,即使该外部函数已经执行结束了,但是内部函数引用外部函数的变量依然保存在内存中,我们就把这些变量的集合称为闭包。比如外部函数是 foo,那么这些变量的集合就称为 foo 函数的闭包。
闭包必须要引用到外部函数的变量,如果没有引用到的话,外部函数执行完之后,JS引擎执行垃圾回收时会认为这个外部函数已经执行完了,执行环境中没有变量被正在引用或者使用,所以可以销毁。

闭包的回收

如果闭包是一个全局变量,页面关闭时它才会被回收,如果是局部变量,则引用它的函数执行完毕后,JS引擎垃圾回收时会将它销毁。
如果这个全局变量的闭包占用了许多内存,又以后不再使用的话,就会造成内存泄漏(该内存空间使用完毕之后未被回收)。
因此如果该闭包会一直使用,那么它可以作为全局变量而存在;但如果使用频率不高,而且占用内存又比较大的话,那就尽量让它成为一个局部变量。

使用

其实我们经常使用到了闭包却没有发现。

  1. 防抖节流,setTimeout

    (function autorun(){let x = 1;setTimeout(function log(){console.log(x);}, 10000);
    })();
    

    变量 x 将一直存活着直到定时器的回调执行或者 clearTimeout() 被调用。 如果这里使用的是 setInterval() ,那么变量 x 将一直存活到 clearInterval() 被调用。

  2. DOM节点事件

    (function autorun(){let x = 1;$("#btn").on("click", function log(){console.log(x);});
    })();
    

    当变量 x 在事件处理函数中被使用时,它将一直存活直到该事件处理函数被移除。

  3. 异步事件 Promise

    (function autorun(){let x = 1;fetch("http://").then(function log(){console.log(x);});
    })();
    

    变量 x 将一直存活到接收到后端返回结果,回调函数被执行。

相关文章:

JavaScript相关(二)——闭包

了解闭包的前提必须得了解什么是作用域链。也就是(一)的内容。 参考: 浏览器工作原理与实践 破解前端面试:从闭包说起 闭包 闭包是一个可以访问外部作用域中变量的内部函数,因为内部函数引用了外部函数的变量&#…...

MySQL的DDL语言

DDL:Data Definition Language(数据定义语言) DDL语言用来定义数据库对象(数据库,表,字段) ps:MySQL中关键字不区分大小写,但是库名、表名等是区分大小写的 一、对数据库操作的DDL 1、查询相关语句&…...

<网络安全>《21 工业安全审计系统》

1 工业安全审计系统 工业审计系统,支持多种工控协议的深度解析,对工控网络中的异常流量进行实时监测和告警,详实记录一切网络通信行为,为工业控制网络安全事件调查提供依据;产品聚焦工业生产安全事件分析,…...

实例分割论文阅读之:《Mask Transfiner for High-Quality Instance Segmentation》

1.摘要 两阶段和基于查询的实例分割方法取得了显著的效果。然而,它们的分段掩模仍然非常粗糙。在本文中,我们提出了一种高质量和高效的实例分割Mask Transfiner。我们的Mask Transfiner不是在规则的密集张量上操作,而是将图像区域分解并表示…...

阿里 EasyExcel 表头国际化

实体类字段使用EasyExcel提供的注解ExcelProperty,value 值写成占位符形式 ,匹配 i18n 文件里面的编码。 如: /*** 仓库名称*/ ExcelProperty("{warehouse.record.warehouseName}") private String warehouseName;占位符解析器 A…...

跨境电商新风潮:充分发挥海外云手机的威力

在互联网行业迅速发展的大环境下,跨境电商、海外社交媒体营销以及游戏产业等重要领域都越来越需要借助海外云手机的协助。 特别是在蓬勃发展的跨境电商领域,像亚马逊、速卖通、eBay等平台,结合社交电商营销和短视频内容成为最有效的流量来源。…...

Kubernetes实战(二十七)-HPA实战

1 HPA简介 HPA 全称是 Horizontal Pod Autoscaler,用于POD 水平自动伸缩, HPA 可以 基于 POD CPU 利用率对 deployment 中的 pod 数量进行自动扩缩容(除了 CPU 也可以基于自定义的指标进行自动扩缩容)。pod 自动缩放不适用于无法…...

IDEA 配置以及一些技巧

1. IDEA设置 1.1 设置主题 1.2 设置字体和字体大小 1.3 编辑区的字体用ctrl鼠标滚轮可以控制大小 1.4 自动导包和优化多余的包 1.5 设置编码方式 1.6 配置 maven 1.7 设置方法形参参数提示 1.8 设置控制台的字体和大小 注意:设置控制台字体和大小后需要重启IDEA才会…...

Android 11 访问 Android/data/或者getExternalCacheDir() 非root方式

前言: 需求要求安装三方应用ExternalCacheDir()下载下来的apk文件。 getExternalCacheDir() : /storage/emulated/0/Android/data/com../cache/ 获取访问权限 如果手机安卓版本为Android10的时候,可以在AndroidManifest.xml中添加下列代码 android:requestLegacyExt…...

Eclipse安装配置、卸载教程(Windows版)

Eclipse是一个开放源代码的集成开发环境(IDE),最初由IBM公司开发,现在由Eclipse基金会负责维护。它是一个跨平台的工具,可以用于开发多种编程语言,如Java、C/C、Python、PHP、Rust等。 Eclipse提供了一个可…...

正点原子--STM32基本定时器学习笔记(2)

目录 1. 相关寄存器介绍 1.1 控制寄存器 1(TIMx_CR1)​编辑 1.2 DMA/中断使能寄存器(TIMx_DIER) 1.3 状态寄存器(TIMx_SR) 1.4 计数器(TIMx_CNT) 1.5 预分频器(TIMx_PSC) 1.6 自动重装载寄存器(TIMx_ARR) 2. 工程建立 3. 导入tim.c文件 4. 相关HAL库函数介绍 4.1 H…...

学习笔记:正则表达式

正则表达式是文本处理方面功能最强大的工具之一。正则表达式语言用来构造正则表达式,最终构造出来的字符串就称为正则表达式,正则表达式用来完成搜索和替换操作。 本文参考《正则表达式必知必会(修订版)》《Learning Regular Exp…...

03-抓包_封包_协议_APP_小程序_PC应用_WEB应用

抓包_封包_协议_APP_小程序_PC应用_WEB应用 一、参考工具二、演示案例:2.1、WEB应用站点操作数据抓包-浏览器审查查看元素网络监听2.2、APP&小程序&PC抓包HTTP/S数据-Charles&Fiddler&Burpsuite2.3、程序进程&网络接口&其他协议抓包-WireSh…...

C语言笔试题之实现C库函数 strstr()(设置标志位)

实例要求: 1、请你实现C库函数strstr()(stdio.h & string.h),请在 haystack 字符串中找出 needle 字符串的第一个匹配项的下标(下标从 0 开始);2、函数声明:int strStr(char* h…...

什么是IDE,新手用哪个IDE比较好

什么是IDE IDE(Integrated Development Environment,集成开发环境)是一种为程序员提供软件开发所需的代码编辑、构建、调试等功能于一体的应用程序。IDE通常包含了代码编辑器、编译器、调试器和图形用户界面等工具,这些工…...

Flask 入门6:模板继承

1. 一个网站中,大部分网页的模块是重复的,比如顶部的导航栏,底部的备案信息。如果在每个页面中都重复的去写这些代码,会让项目变得臃肿,提高后期的维护成本。比较好的做法是,通过模板继承,把一…...

欢迎来到操作系统的世界

🌞欢迎来到操作系统的世界 🌈博客主页:卿云阁 💌欢迎关注🎉点赞👍收藏⭐️留言📝 🌟本文由卿云阁原创! 🙏作者水平很有限,如果发现错误&#xff…...

寒假作业-day5

1>现有无序序列数组为23,24,12,5,33,5347&#xff0c;请使用以下排序实现编程 函数1:请使用冒泡排序实现升序排序 函数2:请使用简单选择排序实现升序排序 函数3:请使用直接插入排序实现升序排序 函数4:请使用插入排序实现升序排序 代码&#xff1a; #include<stdio.h&g…...

互联网加竞赛 基于深度学的图像修复 图像补全

1 前言 &#x1f525; 优质竞赛项目系列&#xff0c;今天要分享的是 基于深度学的图像修复 图像补全 该项目较为新颖&#xff0c;适合作为竞赛课题方向&#xff0c;学长非常推荐&#xff01; &#x1f9ff; 更多资料, 项目分享&#xff1a; https://gitee.com/dancheng-se…...

用于制作耳机壳的UV树脂耳机壳UV胶价格高不高?

制作耳机壳的UV树脂价格相对于一些其他材料可能会略高&#xff0c;但具体的价格取决于多个因素&#xff0c;如品牌、型号、质量等。一些高端的UV树脂品牌和型号可能会价格较高&#xff0c;但它们也通常具有更好的性能和更广泛的应用范围。 此外&#xff0c;UV树脂的价格也与购买…...

ONLYOFFICE Docs与Nextcloud Calendar集成:打造高效私有云日程协作平台

ONLYOFFICE Docs与Nextcloud Calendar集成&#xff1a;打造高效私有云日程协作平台 【免费下载链接】DocumentServer ONLYOFFICE Docs is a free collaborative online office suite comprising viewers and editors for texts, spreadsheets and presentations, forms and PDF…...

OpenClaw快速安装部署:让AI住进你的电脑

一、前言 上篇说完OpenClaw是什么&#xff0c;有小伙伴留言说&#xff1a;“听起来挺猛&#xff0c;但安装肯定很复杂吧&#xff1f;”确实&#xff0c;之前我也有这个顾虑。毕竟涉及到Gateway、Agent、多渠道配置&#xff0c;听起来就头大。 但实际搞下来——就两条命令。 今天…...

强强联合!望石智慧携手华为、华鲲振宇发布AI药物研发联合解决方案,共筑中国智慧医药创新生态

近日&#xff0c;以“因聚而升 融智有为”为主题的华为中国合作伙伴大会2026在深圳圆满落幕。望石智慧作为其国内AI驱动医药创新领域的核心技术伙伴受邀参会&#xff0c;并在智能制造医药行业论坛发表演讲。会议期间&#xff0c;望石智慧、华为、华鲲振宇三方达成战略级生态合作…...

【STM32-HAL库】火焰传感器实战:从原理到智能火灾预警系统搭建(基于STM32F407ZGT6)

1. 火焰传感器原理与选型指南 火焰传感器作为火灾预警系统的"眼睛"&#xff0c;其核心原理是利用光电效应检测火焰特有的光谱特征。我经手过的工业项目中&#xff0c;90%的火灾误报都源于传感器选型不当。市面上常见的火焰传感器主要分为三类&#xff1a; 红外型&…...

Windows下用Rclone挂载WebDAV的完整指南:从安装到开机自启(含常见问题解决)

Windows系统下Rclone挂载WebDAV全流程实战手册 引言&#xff1a;为什么选择Rclone挂载WebDAV&#xff1f; 在日常办公和团队协作中&#xff0c;我们经常需要访问云端存储的文件。WebDAV作为一种基于HTTP协议的文件管理标准&#xff0c;被Nextcloud、OwnCloud等主流网盘广泛支…...

如何用免费工具实现专业级UML设计?高效绘图全攻略

如何用免费工具实现专业级UML设计&#xff1f;高效绘图全攻略 【免费下载链接】umlet Free UML Tool for Fast UML Diagrams 项目地址: https://gitcode.com/gh_mirrors/um/umlet 在软件开发流程中&#xff0c;架构师小张曾因缺少专业UML工具而陷入困境&#xff1a;用普…...

League-Toolkit完全指南:高效BP策略与全方位战绩分析实战应用

League-Toolkit完全指南&#xff1a;高效BP策略与全方位战绩分析实战应用 【免费下载链接】League-Toolkit 兴趣使然的、简单易用的英雄联盟工具集。支持战绩查询、自动秒选等功能。基于 LCU API。 项目地址: https://gitcode.com/gh_mirrors/le/League-Toolkit 功能解析…...

1564286-24-3,Cy5 DBCO SE,应用于生物分子标记、分子成像

一.名称英文名称&#xff1a;Cy5 DBCO NHS Ester&#xff0c;Cy5 DBCO SE&#xff0c;Cyanine5 DBCO NHS Ester&#xff0c;Cy5 Dibenzocyclooctyne NHS Ester中文名称&#xff1a;Cy5-二苯并环辛炔-NHS 酯&#xff0c;花菁染料Cy5-二苯并环辛炔-琥珀酰亚胺酯CAS 号&#xff1a…...

BilibiliDown:B站音视频资源管理的全场景解决方案

BilibiliDown&#xff1a;B站音视频资源管理的全场景解决方案 【免费下载链接】BilibiliDown (GUI-多平台支持) B站 哔哩哔哩 视频下载器。支持稍后再看、收藏夹、UP主视频批量下载|Bilibili Video Downloader &#x1f633; 项目地址: https://gitcode.com/gh_mirrors/bi/Bi…...

Spring Boot 集成云快充协议:充电桩接入平台完整Demo

云快充协议云快充1.5协议云快充1.6云快充协议开源代码云快充底层协议云快充桩直连桩直连协议充电桩协议云快充源码介绍云快充协议云快充1.5协议云快充1.6云快充协议开源代码云快充底层协议云快充桩直连桩直连协议充电桩协议云快充源码软件架构1、提供云快充底层桩直连协议&…...