javascript中闭包概念与用法深入理解

发布时间 - 2026-01-10 21:50:54    点击率:

本文实例分析了javascript中闭包概念与用法。分享给大家供大家参考,具体如下:

1.问题的引出,什么时候会遇到闭包?

首先因为JS是没有块状作用域的,但是有函数作用域即函数作为了局部变量之间的界限,不同函数内的局部变量具有独立性,

因为JS没有块状作用域,笔者初学JS时,在事件的监听时,因为不理解JS中局部变量的作用域,犯过不少错误!

(1)JS中的变量作用域

for(var i=0;i<9;i++)
{
}
alert(i) //输出9

我们发现,虽然变量i是块状区域for()内的一个局部变量,但是我们在块级作用域for()外,依然可以得到变量i

(2)JS中的函数作用域

function abc(){
 var a=1;
}
abc();
alert(a);// 会报错,a is not defined

我们发现,在函数外调用函数后,在函数外是无法取到函数里的变量

总结:通过(1),(2),我们加深了对JS中,没有块级作用域只有函数作用域的理解!

举例:如果现在例1:

var a=1
function abc(){
 var a=2;
}
abc();
alert(a) // a=1

特别注意如果例2:

var a=1
function abc(){
a=2;
alert(a);
}
abc();//a=2

对比例1,不同之处在于例2,中 是“a=2"而不是”var a=2“

区别在于如果是var a,则表示在函数中定义变量a,如果是没有变量声明,如果直接a,则表示在全局变量中定义变量a;

2.如果引用函数内部的变量?

由1可知,JS中只存在函数作用域,那么我们如何才能在拿到函数中定义的变量呢?

根据JS的语法规则:内部函数(或者内部对象)中,可以访问外部函数中的变量。

什么意思呢?举例说明例1:

function abc(){
 var a=1;
 !function(){
 alert(a)
} ()
} //此时不会报错,a=1

再举一个例子(内部对象的例子)例2:

var o={
 a=1,
 myfun:function(){
 return this.a
}
}

则alert(o.myfun())得到的值为1,现在我们大概了解了如何访问函数(或者对象,其实函数的本身也是对象)中的变量!

3.什么是闭包?

我的理解就定义在一个函数内部的函数!

闭包是函数内部与外部之间的桥梁!

即内部函数在定义它的外部使用时,就创建了一个闭包!

我们知道,一般情况下,当函数被调用完,内存会被释放,但是应用于函数闭包比如

function abc1(){
 var a=1;
function abc2(){
 a++;
}
return abc2()
}

当我们调用abc1()函数后,因为abc1函数的中又调用了abc2()函数,因此函数abc1()中的变量在子函数中被调用,所以在父函数abc1()调用结束后

变量a的内存空间并不会被释放!

为什么GC机制无法回收abc1()函数中的变量a,  因为首先我们在全局中调用了函数abc1(),我们设全局对象为c,abc1()对象为b,同时我们在对象b

即函数abc1()中又调用了函数abc2(),设abc2(0为a。

再次理解这种关系    c中调用了b,b中又调用了a,JS中规定当a,b对象两两互相引用,并且a,b中又有一个被a,b函数之外的对象c引用时,GC机制不执行垃圾回收(变量清空)!

由此我们引出了闭包的重要作用:

如果内部函数在其外部被调用,则会产生闭包,闭包用于保存某些变量的值,不会被垃圾回收机制回收!

4.闭包的缺点

因为使用闭包后,某些变量会在函数调用之后持续的保持在内存中,因此滥用闭包会导致内存泄漏!

5.扩展应用,加深对于闭包的理解!

var o={
 a:1;
myfunc:function(){
return function(){
 return this.a;
}
}
alert(o.myfunc()()); // a is not defined
}

更多关于JavaScript相关内容感兴趣的读者可查看本站专题:《JavaScript数据结构与算法技巧总结》、《JavaScript数学运算用法总结》、《JavaScript切换特效与技巧总结》、《JavaScript查找算法技巧总结》、《JavaScript错误与调试技巧总结》及《JavaScript遍历算法与技巧总结》

希望本文所述对大家JavaScript程序设计有所帮助。


# javascript  # 闭包  # javascript中的闭包概念与用法实践分析  # JavaScript作用域、闭包、对象与原型链概念及用法实例总结  # javascript闭包概念简单解析(推荐)  # jquery闭包概念分析  # Javascript的独特的概念之闭包  # 中又  # 报错  # 相关内容  # 什么时候  # 遍历  # 会在  # 感兴趣  # 数据结构  # 给大家  # 应用于  # 当我们  # 可以得到  # 更多关于  # 什么意思  # 重要作用  # 则会  # 所述  # 不理解  # 程序设计  # 值为 


相关栏目: 【 网站优化151355 】 【 网络推广146373 】 【 网络技术251813 】 【 AI营销90571


相关推荐: EditPlus中的正则表达式 实战(2)  Laravel怎么导出Excel文件_Laravel Excel插件使用教程  Laravel怎么实现前端Toast弹窗提示_Laravel Session闪存数据Flash传递给前端【方法】  如何在万网自助建站中设置域名及备案?  Laravel如何实现多语言支持_Laravel本地化与国际化(i18n)配置教程  教你用AI将一段旋律扩展成一首完整的曲子  在线制作视频网站免费,都有哪些好的动漫网站?  如何在IIS7上新建站点并设置安全权限?  如何快速查询域名建站关键信息?  Laravel如何配置.env文件管理环境变量_Laravel环境变量使用与安全管理  PHP 500报错的快速解决方法  成都品牌网站制作公司,成都营业执照年报网上怎么办理?  如何快速生成橙子建站落地页链接?  Laravel如何生成URL和重定向?(路由助手函数)  微博html5版本怎么弄发语音微博_语音录制入口及时长限制操作【教程】  Thinkphp 中 distinct 的用法解析  最好的网站制作公司,网购哪个网站口碑最好,推荐几个?谢谢?  如何快速搭建高效香港服务器网站?  Laravel如何部署到服务器_线上部署Laravel项目的完整流程与步骤  Laravel如何处理CORS跨域问题_Laravel项目CORS配置与解决方案  Laravel Artisan命令怎么自定义_创建自己的Laravel命令行工具完全指南  Laravel如何处理异常和错误?(Handler示例)  如何在IIS服务器上快速部署高效网站?  UC浏览器如何切换小说阅读源_UC浏览器阅读源切换【方法】  微信小程序 配置文件详细介绍  微信小程序 五星评分(包括半颗星评分)实例代码  制作ppt免费网站有哪些,有哪些比较好的ppt模板下载网站?  Laravel怎么连接多个数据库_Laravel多数据库连接配置  Javascript中的事件循环是如何工作的_如何利用Javascript事件循环优化异步代码?  合肥制作网站的公司有哪些,合肥聚美网络科技有限公司介绍?  如何为不同团队 ID 动态生成多个独立按钮  儿童网站界面设计图片,中国少年儿童教育网站-怎么去注册?  Laravel事件监听器怎么写_Laravel Event和Listener使用教程  Laravel如何获取当前用户信息_Laravel Auth门面获取用户ID  Laravel如何编写单元测试和功能测试?(PHPUnit示例)  高防网站服务器:DDoS防御与BGP线路的AI智能防护方案  如何快速搭建高效服务器建站系统?  如何在自有机房高效搭建专业网站?  如何在阿里云ECS服务器部署织梦CMS网站?  laravel怎么配置和使用PHP-FPM来优化性能_laravel PHP-FPM配置与性能优化方法  Laravel如何使用Eloquent进行子查询  Android中AutoCompleteTextView自动提示  Win11关机界面怎么改_Win11自定义关机画面设置【工具】  html如何与html链接_实现多个HTML页面互相链接【互相】  文字头像制作网站推荐软件,醒图能自动配文字吗?  Java遍历集合的三种方式  javascript中数组(Array)对象和字符串(String)对象的常用方法总结  如何在建站之星绑定自定义域名?  Angular 表单中正确绑定输入值以确保提交与验证正常工作  Laravel怎么配置S3云存储驱动_Laravel集成阿里云OSS或AWS S3存储桶【教程】