详谈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 相关文章推荐
js几个验证函数代码
Mar 25 Javascript
Prototype的Class.create函数解析
Sep 22 Javascript
jQuery EasyUI API 中文文档 - Form表单
Oct 06 Javascript
JS获取农历日期具体实例
Nov 14 Javascript
JavaScript中变量声明有var和没var的区别示例介绍
Sep 15 Javascript
使用HTML5+Boostrap打造简单的音乐播放器
Aug 05 Javascript
详解JS去重及字符串奇数位小写转大写
Dec 29 Javascript
Vue 使用中的小技巧
Apr 26 Javascript
JS实现监控微信小程序的原理
Jun 15 Javascript
angular4 获取wifi列表中文显示乱码问题的解决
Oct 20 Javascript
vue项目中在外部js文件中直接调用vue实例的方法比如说this
Apr 28 Javascript
react国际化react-intl的使用
May 06 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
腾讯QQ php程序员面试题目整理
2010/06/08 PHP
PHP swoole和redis异步任务实现方法分析
2019/08/12 PHP
jquery 学习笔记 传智博客佟老师附详细注释
2020/09/12 Javascript
运用jquery实现table单双行不同显示并能单行选中
2009/07/25 Javascript
javascript利用控件对windows的操作实现原理与应用
2012/12/23 Javascript
解析Jquery的LigerUI如何实现文件上传
2013/07/09 Javascript
js和jquery中循环的退出和继续学习记录
2014/09/06 Javascript
Nodejs异步回调的优雅处理方法
2014/09/25 NodeJs
网页中表单按回车就自动提交的问题的解决方案
2014/11/03 Javascript
jquery中EasyUI实现同步树
2015/03/01 Javascript
jquery实现列表上下移动功能
2016/02/25 Javascript
jQuery+ajax实现实用的点赞插件代码
2016/07/06 Javascript
Knockout结合Bootstrap创建动态UI实现产品列表管理
2016/09/14 Javascript
jQuery插件HighCharts绘制2D圆环图效果示例【附demo源码下载】
2017/03/09 Javascript
微信小程序富文本渲染引擎的详解
2017/09/30 Javascript
详解JSON和JSONP劫持以及解决方法
2019/03/08 Javascript
微信小程序实现图片翻转效果的实例代码
2019/09/20 Javascript
vue实现鼠标经过动画
2019/10/16 Javascript
详解基于element的区间选择组件校验(交易金额)
2021/01/07 Javascript
numpy排序与集合运算用法示例
2017/12/15 Python
实践Vim配置python开发环境
2018/07/02 Python
Django实现表单验证
2018/09/08 Python
详解Python进阶之切片的误区与高级用法
2018/12/24 Python
python实现俄罗斯方块游戏(改进版)
2020/03/13 Python
Pyspark读取parquet数据过程解析
2020/03/27 Python
TensorFlow使用Graph的基本操作的实现
2020/04/22 Python
浅谈基于HTML5的在线视频播放方案
2016/02/18 HTML / CSS
移动通信行业实习自我鉴定
2013/09/28 职场文书
党委班子对照检查材料
2014/08/19 职场文书
自愿解除劳动合同协议书
2014/09/11 职场文书
岗位职责范本大全
2015/02/26 职场文书
教师个人自我评价
2015/03/04 职场文书
酒店销售经理岗位职责
2015/04/02 职场文书
2016年万圣节活动总结
2016/04/05 职场文书
手把手教你怎么用Python实现zip文件密码的破解
2021/05/27 Python
PostgreSQL并行计算算法及参数强制并行度设置方法
2022/04/06 PostgreSQL