详谈JavaScript的闭包及应用


Posted in Javascript onJanuary 17, 2017

闭包真的是学过一遍又一遍,Js博大精深,每次学习都感觉有新的收获。相信在大家封装前端插件时,闭包是必不可少的。闭包的真正好处我个人认为除了封装还是封装,能带个我们私有方法,和调用上的灵活方便,也会使你的代码对外的对象保持干净整洁。

进入正题

维基百科这样定义了JS闭包:在计算机科学中,闭包(英语:Closure),又称词法闭包(Lexical Closure)或函数闭包(function closures),是引用了自由变量的函数。这个被引用的自由变量将和这个函数一同存在,即使已经离开了创造它的环境也不例外。所以,有另一种说法认为闭包是由函数和与其相关的引用环境组合而成的实体。闭包在运行时可以有多个实例,不同的引用环境和相同的函数组合可以产生不同的实例。

通俗的讲,闭包不同于一般函数,它允许一个函数在立即此法调用的作用域外,仍可访问非本地变量。我还想说,闭包的语法让你的代码更加动感,下面的一段代码可能会让你有所感触。

<script>
 (function () {
 var userToken = "this is my token";
 var someConfig = "opening some function";
 var privateValue = "private";
 var publicValue = "public";
 var appObj = {};
 function myPrivateFunc() {
 alert(privateValue)
 }
 appObj.getUserToken = function () {
 //some logic
 userToken += " after some inner logic";
 return userToken;
 }
 appObj.publicVal = publicValue;
 window.application = appObj;
 }());//立即执行
 console.log(application.getUserToken());//this is my token after some inner logic
 console.log(application.publicVal);//public
 console.log(application.privateValue); //undefined
 application.myPrivateFunc(); //error
 </script>

我将appObj附加到window下面,我通常喜欢定义一个全局的名为application的对象,代表着整个应用公用的顶级对象,你可以在其中向外暴露很多公共的操作方法,也可以在其中做一些私有的处理,以防外部调用导致某些问题。在所定义的“顶级”application对象下,你也可以将你所非要不可的全局变量定义在其中,这样以防普通全局变量对应用造成的影响,又可以在你定义的闭包内,通过向外暴露的对象表达更明确的信息,我一直认为,随随便便定义一个JS全局变量实在是太可耻了。

闭包的写法加上VS强大的智能提示,你会感觉到无比的畅快。下面我又附加了一个方法

(function () {
 var baseUrl = "www.cnblogs.com/tdws/";

 application.getBaseUrl = function () {
 return baseUrl;
 }
 }());
 console.log(application.getBaseUrl());//www.cnblogs.com/tdws/

详谈JavaScript的闭包及应用

写在最后

你不觉得把变量保留起来,暴露出一系列get方法,很动感吗 ?(?-?)? 摊手......

当然闭包也需要你恰当的使用,不要造成循环引用,因为它将导致内存泄漏。不要做无谓的闭包,造成你空间的浪费,因为闭包不会被释放。不要处处闭包,因为它将增加你代码的复杂性。

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持三水点靠木!

Javascript 相关文章推荐
jquery ajaxSubmit 异步提交的简单实现
Feb 28 Javascript
在jquery boxy中添加百度地图坐标拾取注意流程
Apr 03 Javascript
Spring mvc 接收json对象
Dec 10 Javascript
百度地图给map添加右键菜单(判断是否为marker)
Mar 04 Javascript
jQuery 更改checkbox的状态,无效的解决方法
Jul 22 Javascript
Boostrap实现的登录界面实例代码
Oct 09 Javascript
Jquery Easyui表单组件Form使用详解(30)
Dec 19 Javascript
js遍历json对象所有key及根据动态key获取值的方法(必看)
Mar 09 Javascript
JS 插件dropload下拉刷新、上拉加载使用小结
Apr 13 Javascript
vue移动端裁剪图片结合插件Cropper的使用实例代码
Jul 10 Javascript
微信小程序实现同一页面取值的方法分析
Apr 30 Javascript
angularjs模态框的使用代码实例
Dec 20 Javascript
用原生js做单页应用
Jan 17 #Javascript
js cookie实现记住密码功能
Jan 17 #Javascript
angularjs ocLazyLoad分步加载js文件实例
Jan 17 #Javascript
微信小程序 登陆流程详细介绍
Jan 17 #Javascript
jQuery无刷新上传之uploadify简单代码
Jan 17 #Javascript
javascript判断元素存在和判断元素存在于实时的dom中的方法
Jan 17 #Javascript
js处理层级数据结构的方法小结
Jan 17 #Javascript
You might like
ThinkPHP3.1新特性之对Ajax的支持更加完善
2014/06/19 PHP
PHP生成唯一订单号
2015/07/05 PHP
php获取数据库结果集方法(推荐)
2017/06/01 PHP
JavaScript的常见兼容问题及相关解决方法(chrome/IE/firefox)
2013/12/31 Javascript
JavaScript打印网页指定区域的例子
2014/05/03 Javascript
重写document.write实现无阻塞加载js广告(补充)
2014/12/12 Javascript
JavaScript中用字面量创建对象介绍
2014/12/31 Javascript
javascript实现详细时间提醒信息效果的方法
2015/03/11 Javascript
使用AngularJS来实现HTML页面嵌套的方法
2015/06/17 Javascript
vue.js中过滤器的使用教程
2017/06/08 Javascript
js实现省市级联效果分享
2017/08/10 Javascript
vue在使用ECharts时的异步更新和数据加载详解
2017/11/22 Javascript
vue单页面打包文件大?首次加载慢?nginx带你飞,从7.5M到1.3M蜕变过程(推荐)
2018/01/16 Javascript
在vue项目中使用element-ui的Upload上传组件的示例
2018/02/08 Javascript
echarts多条折线图动态分层的实现方法
2019/05/24 Javascript
加速vue组件渲染之性能优化
2020/04/09 Javascript
如何在面试中手写出javascript节流和防抖函数
2020/10/22 Javascript
python 删除列表里所有空格项的方法总结
2018/04/18 Python
python 将print输出的内容保存到txt文件中
2018/07/17 Python
python 简单照相机调用系统摄像头实现方法 pygame
2018/08/03 Python
详解重置Django migration的常见方式
2019/02/15 Python
Python PIL读取的图像发生自动旋转的实现方法
2019/07/05 Python
python 爬取学信网登录页面的例子
2019/08/13 Python
Python 多线程C段扫描、检测 Ping扫描脚本的实现
2020/09/03 Python
css3实现椭圆轨迹旋转的示例代码
2018/10/29 HTML / CSS
美国高端婴童品牌:Hanna Andersson
2016/10/30 全球购物
意大利独特而优质的家居用品:Fazzini
2018/12/05 全球购物
阿迪达斯新加坡官方网站:adidas新加坡
2019/12/06 全球购物
Michael Kors香港官网:美国奢侈品品牌
2019/12/26 全球购物
汽车制造与装配专业自荐信范文
2014/01/02 职场文书
《与朱元思书》的教学反思
2014/04/17 职场文书
《明天,我们毕业》教学反思
2014/04/24 职场文书
药店促销活动策划方案
2014/08/24 职场文书
区域经理岗位职责
2015/02/02 职场文书
房地产财务经理岗位职责
2015/04/08 职场文书
借条如何写
2015/05/26 职场文书