再谈JavaScript闭包及应用

hgqf5351 4年前
   <h3><strong>写在前面</strong></h3>    <p>闭包真的是学过一遍又一遍,Js博大精深,每次学习都感觉有新的收获。相信在大家封装前端插件时,闭包是必不可少的。闭包的真正好处我个人认为除了封装还是封装,能带个我们私有方法,和调用上的灵活方便,也会使你的代码对外的对象保持干净整洁。</p>    <h3><strong>进入正题</strong></h3>    <p>维基百科这样定义了JS闭包:在计算机科学中, <strong>闭包</strong> ( 英语: Closure),又称 <strong>词法闭包</strong> ( Lexical Closure)或 <strong>函数闭包</strong> ( function closures),是引用了自由变量的函数。这个被引用的自由变量将和这个函数一同存在,即使已经离开了创造它的环境也不例外。所以,有另一种说法认为闭包是由函数和与其相关的引用环境组合而成的实体。闭包在运行时可以有多个实例,不同的引用环境和相同的函数组合可以产生不同的实例。</p>    <p>通俗的讲,闭包不同于一般函数,它允许一个函数在立即此法调用的作用域外,仍可访问非本地变量。我还想说,闭包的语法让你的代码更加动感,下面的一段代码可能会让你有所感触。</p>    <pre>  <code class="language-javascript"><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>  </code></pre>    <p>我将appObj附加到window下面,我通常喜欢定义一个全局的名为application的对象,代表着整个应用公用的顶级对象,你可以在其中向外暴露很多公共的操作方法,也可以在其中做一些私有的处理,以防外部调用导致某些问题。在所定义的“顶级”application对象下,你也可以将你所非要不可的全局变量定义在其中,这样以防普通全局变量对应用造成的影响,又可以在你定义的闭包内,通过向外暴露的对象表达更明确的信息,我一直认为,随随便便定义一个JS全局变量实在是太可耻了。</p>    <p>闭包的写法加上VS强大的智能提示,你会感觉到无比的畅快。下面我又附加了一个方法</p>    <pre>  <code class="language-javascript">         (function () {              var baseUrl = "www.cnblogs.com/tdws/";                application.getBaseUrl = function () {                  return baseUrl;              }          }());            console.log(application.getBaseUrl());//www.cnblogs.com/tdws/  </code></pre>    <p><img src="https://simg.open-open.com/show/3e98c708d3239ee86b225dd5f03c2a95.png"></p>    <h3><strong>写在最后</strong></h3>    <p>你不觉得把变量保留起来,暴露出一系列get方法,很动感吗 ╮(╯-╰)╭ 摊手......</p>    <p>当然闭包也需要你恰当的使用, 不要造成循环引用,因为它将导致内存泄漏。不要做无谓的闭包,造成你空间的浪费,因为闭包不会被释放。不要处处闭包,因为它将增加你代码的复杂性。</p>    <p>如果你觉得我的点滴分享,对你有点滴帮助,欢迎点击下方红色按钮关注,我将持续分享。也欢迎点下推荐,为我,也你自己点赞。</p>    <p> </p>    <p>来自:http://www.cnblogs.com/tdws/p/5944254.html</p>    <p> </p>