详谈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实现LOADING效果
Mar 16 Javascript
由浅入深剖析Angular表单验证
Jul 14 Javascript
Sequelize中用group by进行分组聚合查询
Dec 12 Javascript
浅谈Angular.js中使用$watch监听模型变化
Jan 10 Javascript
vue.js学习笔记:如何加载本地json文件
Jan 17 Javascript
Vue.js学习教程之列表渲染详解
May 17 Javascript
微信小程序 生命周期函数详解
May 24 Javascript
JS二分查找算法详解
Nov 01 Javascript
解决Mac下安装nmp的淘宝镜像失败问题
May 16 Javascript
使用async await 封装 axios的方法
Jul 09 Javascript
基于vue-cli3和element实现登陆页面
Nov 13 Javascript
echarts 使用formatter 修改鼠标悬浮事件信息操作
Jul 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
8个PHP程序员常用的功能汇总
2014/12/18 PHP
php三元运算符知识汇总
2015/07/02 PHP
thinkphp分页集成实例
2017/07/24 PHP
PHP信号处理机制的操作代码讲解
2019/04/19 PHP
JQuery Tips(4) 一些关于提高JQuery性能的Tips
2009/12/19 Javascript
用Javascript评估用户输入密码的强度实现代码
2011/11/30 Javascript
js实现在文本框光标处添加字符的方法介绍
2012/11/24 Javascript
模拟jQuery中的ready方法及实现按需加载css,js实例代码
2013/09/27 Javascript
利用js判断浏览器类型(是否为IE,Firefox,Opera浏览器)
2013/11/22 Javascript
使用js实现关闭js弹出层的窗口
2014/02/10 Javascript
jQuery 删除或是清空某个HTML元素示例
2014/08/04 Javascript
使用js dom和jquery分别实现简单增删改
2014/09/11 Javascript
JavaScript中的console.profile()函数详细介绍
2014/12/29 Javascript
学习javascript面向对象 理解javascript对象
2016/01/04 Javascript
jquery分页插件jquery.pagination.js实现无刷新分页
2016/04/01 Javascript
原生js实现网易轮播图效果
2020/04/10 Javascript
node实现简单的反向代理服务器
2017/07/26 Javascript
javascript闭包的使用之按钮切换功能
2018/08/30 Javascript
vue将后台数据时间戳转换成日期格式
2019/07/31 Javascript
VUE项目初建和常见问题总结
2019/09/12 Javascript
jQuery实现雪花飘落效果
2020/08/02 jQuery
[01:14:35]DOTA2上海特级锦标赛B组资格赛#1 Alliance VS Fnatic第一局
2016/02/26 DOTA
用python实现对比两张图片的不同
2018/02/05 Python
python opencv人脸检测提取及保存方法
2018/08/03 Python
Tensorflow使用支持向量机拟合线性回归
2018/09/07 Python
如何安装2019Pycharm最新版本(详细教程)
2019/09/26 Python
Python3.7基于hashlib和Crypto实现加签验签功能(实例代码)
2019/12/04 Python
Django实现任意文件上传(最简单的方法)
2020/06/03 Python
Python 发送邮件方法总结
2020/08/10 Python
Hotels.com中国区:好订网
2016/08/18 全球购物
ETO男装官方网店:ETO Jeans
2019/02/28 全球购物
男性健康日的活动方案
2014/08/18 职场文书
2015国庆节66周年演讲稿
2015/03/20 职场文书
思想工作总结范文
2015/08/12 职场文书
解决Maven项目中 Invalid bound statement 无效的绑定问题
2021/06/15 Java/Android
redis lua限流算法实现示例
2022/07/15 Redis