4、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()();// 小明

相关新闻

最新新闻

深度学习语义分割实战:智能小车车道线检测从训练到部署

深度学习语义分割实战:智能小车车道线检测从训练到部署

简介:计算机视觉中的图像分割技术正在改变传统车道线检测的局限。与依赖边缘检测或颜色阈值的传统算法不同,语义分割通过神经网络对图像进行逐像素分类,能够自适应光照变化、路面纹理干扰等复杂场景,为智能小车提供稳定的感知基础…

2026/8/26 10:16:02
C++机试算法精解:动态规划与回溯实战

C++机试算法精解:动态规划与回溯实战

1. 项目背景与核心价值 最近在准备C机试的过程中,我发现很多同学对特定日期(如2023年3月9日)的机试题特别关注。这类题目往往考察编程基本功和算法思维,是检验C实战能力的绝佳素材。今天我就来详细拆解t73-t75这三道典型机试题&am…

2026/8/26 10:16:02
OpenClaw智能体框架:从部署到实战,打造AI自动化工作流

OpenClaw智能体框架:从部署到实战,打造AI自动化工作流

1. 项目概述:从“能用”到“会用”的鸿沟最近在AI智能体圈子里,OpenClaw(小龙虾)这个名字越来越频繁地被提及。很多朋友兴冲冲地跟着教程,用Docker或者一键脚本把它装好了,看着那个简洁的Web界面&#xff0…

2026/8/26 10:16:02
高通AI Engine Direct:深入HTP底层接口与性能优化实战

高通AI Engine Direct:深入HTP底层接口与性能优化实战

1. 项目概述:深入高通AI引擎的底层接口如果你正在高通骁龙平台上折腾AI模型部署,那么“AI Engine Direct”这个名字你一定不陌生。它不是什么高深莫测的新框架,而是高通为开发者提供的一套直接与底层硬件AI加速器(主要是Hexagon T…

2026/8/26 10:16:02
YOLOv8+ByteTrack实时目标跟踪实战:训练、调参与嵌入式部署

YOLOv8+ByteTrack实时目标跟踪实战:训练、调参与嵌入式部署

简介:在计算机视觉领域,目标检测与多目标跟踪是支撑智能视频分析的两大基石。YOLOv8作为高效实时检测器,以高精度和灵活部署著称;而ByteTrack则凭借独特的BYTE关联机制与卡尔曼滤波,在不引入额外ReID模型的前提下实现稳…

2026/8/26 10:16:02
用类型系统驯服LLM:让模型输出可编程、可验证

用类型系统驯服LLM:让模型输出可编程、可验证

我在做客服工单分类时遇到过一件很折磨人的事。第一次调用大模型,让它从用户反馈里抽出几个字段,很快就跑通了。可一放到真实数据里,输出就开始“表演”:有时把 JSON 包在 markdown 代码块里,有时多返回一个字段&#…

2026/8/26 10:11:01