JavaScript作用域与闭包讲解 - JavaScript学习系列文章 一、什么是作用域简单来说,作用域就是变量起作用的范围.想象一下, 你在家里喊开饭啦!只有家里的人能听见; 在小区里喊, 整个小区都能听见; 在大街上喊...呃, 可能会被当成神经病. JavaScript的作用域也是类似的道理. 1) 全局作用域全局作用域就像是在大街上喊话, 所有人都能听见 (所有代码都能访问).//全局变量, 在任何地方都能访问const globalMessage Hello World;functionsayHello() {console.log(globalMessage);//可以访问全局变量}sayHello();//输出Hello Worldconsole.log(globalMessage);//同样可以访问但是要注意,滥用全局变量是个坏习惯!就像你不会在大街上喊你的银行卡密码一样, 太多全局变量容易造成命名冲突和难以维护. 2) 函数作用域函数作用域就像是在自己家里说话, 只有家里人能听见functionfamilyMeeting() {const secret 咱家存款有100万;//函数作用域内的变量console.log(secret);//可以访问}familyMeeting();// console.log(secret); //报错!外面访问不到secret3) 块级作用域块级作用域是ES6引入的, 用let和const声明的变量只在{}内有效.if (true) {let blockScoped 我在块里面;const alsoBlockScoped 我也是;var notBlockScoped 我不是块作用域;//var没有块级作用域}console.log(notBlockScoped);//我不是块作用域// console.log(blockScoped); //报错// console.log(alsoBlockScoped); //报错var没有块级作用域!它只有函数作用域. 这也是为什么现在推荐用let和const.二、作用域链现在来点进阶的——作用域链. 想象你在公司里:1. 先在自己工位找文件(当前作用域)2. 找不到就去部门公共区域找(外层作用域)3. 还找不到就去公司档案室找(更外层作用域)4. 最后可能去总部找(全局作用域)JavaScript查找变量也是这样一层层往外找的:const company 阿里;//全局作用域functiondepartment() {const team 前端;//department函数作用域functionmyDesk() {const name 小明;//myDesk函数作用域console.log(name);//小明 (当前作用域)console.log(team);//前端 (上一层作用域)console.log(company);//阿里 (全局作用域)}myDesk();}department();作用域链是在函数定义时就确定好的, 不是调用时确定的! 这就是所谓的静态作用域. 三、闭包闭包是JavaScript中最强大的特性之一, 也是面试必问的.1) 闭包是指那些能够访问自由变量的函数(自由变量是指在函数中使用, 但既不是函数参数也不是函数局部变量的变量).当一个函数记住并访问它所在的词法作用域时, 就产生了闭包,即使这个函数是在当前词法作用域之外执行. 示例:functionouter() {const secret 我爱JavaScript;functioninner() {console.log(secret);//访问外部函数的变量}return inner;}const myFunc outer();myFunc();//我爱JavaScript这里inner函数就是一个闭包, 因为它记住了outer的作用域, 即使outer已经执行完毕了. 2) 闭包的作用1-创建私有变量functioncreateCounter() {let count 0;//这个变量外部无法直接访问return {increment:function() {count;console.log(count);},decrement:function() {count--;console.log(count);}};}const counter createCounter();counter.increment();//1counter.increment();//2counter.decrement();//1// console.log(count); // 报错, count不可访问3) 闭包的作用2-函数柯里化柯里化是把接受多个参数的函数变成接受单一参数的函数的过程functionmultiply(a) {returnfunction(b) {return a * b;};}const double multiply(2);console.log(double(5));// 10console.log(double(10));// 20const triple multiply(3);console.log(triple(5));// 154) 闭包的作用3-模块模式现代模块系统的基础就是闭包const myModule (function() {const privateVar 我是私有的;functionprivateMethod() {console.log(privateVar);}return {publicMethod:function() {privateMethod();}};})();myModule.publicMethod();//我是私有的// myModule.privateMethod(); //报错// console.log(myModule.privateVar); //undefined5) 闭包使用的注意事项闭包虽好, 也有风险,内存泄漏风险:因为闭包会保留对外部变量的引用, 所以如果不小心, 可能会导致内存无法被回收.示例//不好的例子functionleakMemory() {const hugeArray newArray(1000000).fill(0);returnfunction() {console.log(我保留了hugeArray的引用);};}const leakyFunc leakMemory();//即使leakMemory执行完毕, hugeArray也不会被回收6) 闭包与thisconst obj {name:小明,sayName:function() {returnfunction() {console.log(this.name);};}};obj.sayName()();//输出什么答案是undefined!因为内部函数的this指向全局对象(严格模式下是undefined)不是obj.解决方案: 保存this引用const obj {name:小明,sayName:function() {const self this;returnfunction() {console.log(self.name);};}};obj.sayName()();//小明或者使用箭头函数const obj {name:小明,sayName:function() {return() {console.log(this.name);};}};obj.sayName()();// 小明

相关新闻

最新新闻

OpenKedge:AI智能体安全治理框架与Agentic Mutation实践

OpenKedge:AI智能体安全治理框架与Agentic Mutation实践

1. 项目概述:当智能体开始“自我进化”,我们如何确保安全?最近,一个名为OpenKedge的概念在技术社区里被频繁讨论。它直指一个正在发生、且越来越紧迫的问题:当AI智能体(Agent)具备了自我修改、自…

2026/8/25 11:29:34
CiA 304详解:CANopen功能安全通信的核心协议

CiA 304详解:CANopen功能安全通信的核心协议

1. 项目概述:为什么CiA 304不是“另一个CANopen补充协议”,而是功能安全落地的关键拼图如果你正在做伺服驱动器、PLC安全模块、电梯控制柜或AGV底盘控制器,又或者你刚接手一个需要通过EN ISO 13849-1 PLd或IEC 61508 SIL2认证的工业设备项目&…

2026/8/25 11:29:34
Minecraft Forge 1.20.1 创造模式物品栏(CreativeModeTab)开发全解析

Minecraft Forge 1.20.1 创造模式物品栏(CreativeModeTab)开发全解析

1. 这不是“加个按钮”那么简单:创造模式物品栏的本质是游戏内UI调度系统你搜“Minecraft Mod 开发:4-创造模式物品栏”,大概率刚写完前三个教程——注册方块、注册物品、处理基础事件,正准备把自制道具塞进创造模式里&#xff0c…

2026/8/25 11:29:34
C++结构体排序:重载运算符、自定义函数与Lambda表达式实战指南

C++结构体排序:重载运算符、自定义函数与Lambda表达式实战指南

1. 从一次数据展示的尴尬说起:为什么结构体排序是基本功最近在帮一个做嵌入式设备日志分析的朋友看代码,他遇到了一个挺典型的问题。设备上报的日志数据包是一个结构体数组,每个结构体包含了时间戳、设备ID、错误码和描述信息。他的需求很简单…

2026/8/25 11:29:34
ZAP HUD实战指南:提升Web渗透测试效率的核心交互层

ZAP HUD实战指南:提升Web渗透测试效率的核心交互层

1. ZAP HUD到底是什么,为什么它让很多刚入门的安全测试人员突然“开窍”ZAP HUD(Head-Up Display)不是汽车挡风玻璃上投射车速的光学设备,也不是什么新出的AR眼镜套件——它是OWASP ZAP官方在2020年正式集成进主程序的一个实时交互…

2026/8/25 11:29:34
从静默死亡到进程崩溃:C# BackgroundService 在信创环境的 5 个夺命坑,你踩过几个?

从静默死亡到进程崩溃:C# BackgroundService 在信创环境的 5 个夺命坑,你踩过几个?

🔥关注墨瑾轩,带你探索编程的奥秘!🚀 🔥超萌技术攻略,轻松晋级编程高手🚀 🔥技术宝库已备好,就等你来挖掘🚀 🔥订阅墨瑾轩,智趣学习不…

2026/8/25 11:24:34