详谈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 相关文章推荐
JavaScript 事件查询综合
Jul 13 Javascript
javascript 简练的几个函数
Aug 29 Javascript
用javascript获取当页面上鼠标光标位置和触发事件的对象的代码
Dec 09 Javascript
JS 非图片动态loading效果实现代码
Apr 09 Javascript
JQuery里选择超链接的实现代码
May 22 Javascript
多个checkbox被选中时如何判断是否有自己想要的
Sep 22 Javascript
bootstrap-treeview自定义双击事件实现方法
Jan 09 Javascript
Javascript前端经典的面试题及答案
Mar 14 Javascript
Vue 父子组件数据传递的四种方式( inheritAttrs + $attrs + $listeners)
May 04 Javascript
JS获取并处理php数组的方法实例分析
Sep 04 Javascript
jQuery实现为动态添加的元素绑定事件实例分析
Sep 07 jQuery
微信小程序 可搜索的地址选择实现详解
Aug 28 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
php面向对象全攻略 (七) 继承性
2009/09/30 PHP
深入PHP购物车模块功能分析(函数讲解,附源码)
2013/06/25 PHP
基于flush()不能按顺序输出时的解决办法
2013/06/29 PHP
PHP面向对象之事务脚本模式(详解)
2017/06/07 PHP
PHP微信H5支付开发实例
2018/07/25 PHP
PHP 获取客户端 IP 地址的方法实例代码
2018/11/11 PHP
AJAX的跨域与JSONP(为文章自动添加短址的功能)
2010/01/17 Javascript
JavaScript子窗口ModalDialog中操作父窗口对像
2012/12/11 Javascript
JavaScript实现复制功能各浏览器支持情况实测
2013/07/18 Javascript
JS 删除字符串最后一个字符的实现代码
2014/02/20 Javascript
JQuery插件ajaxfileupload.js异步上传文件实例
2015/05/19 Javascript
基于jQuery通过jQuery.form.js插件实现异步上传
2015/12/13 Javascript
详解react、redux、react-redux之间的关系
2018/04/11 Javascript
jQuery实现的简单手风琴效果示例
2018/08/29 jQuery
值得收藏的八个常用的js正则表达式
2018/10/19 Javascript
JavaScript中的垃圾回收与内存泄漏示例详解
2019/05/02 Javascript
Element-ui DatePicker显示周数的方法示例
2019/07/19 Javascript
JavaScript:ES2019 的新特性(译)
2019/08/08 Javascript
jQuery实现小火箭返回顶部特效
2020/02/03 jQuery
Python 登录网站详解及实例
2017/04/11 Python
Python守护线程用法实例
2017/06/23 Python
python验证码识别的示例代码
2017/09/21 Python
python opencv实现任意角度的透视变换实例代码
2018/01/12 Python
django初始化数据库的实例
2018/05/27 Python
Python的条件表达式和lambda表达式实例
2019/01/31 Python
Django对接支付宝实现支付宝充值金币功能示例
2019/12/17 Python
解决pycharm上的jupyter notebook端口被占用问题
2019/12/17 Python
Python版中国省市经纬度
2020/02/11 Python
Python Pillow(PIL)库的用法详解
2020/09/19 Python
Meli Melo官网:名媛们钟爱的英国奢侈手包品牌
2017/04/17 全球购物
巴西箱包、背包、钱包和旅行配件购物网站:Inovathi
2019/12/14 全球购物
德国玩具商店:Planet Happy DE
2021/01/16 全球购物
澳大利亚排名第一的露营和户外设备在线零售商:Outbax
2020/05/06 全球购物
会计岗位职责
2013/11/08 职场文书
《广玉兰》教学反思
2014/04/14 职场文书
原料仓管员岗位职责
2015/04/01 职场文书