詳談JavaScript的閉包及應用-js教程-PHP中文網

詳談JavaScript的閉包及應用

高洛峰

發布： 2017-01-20 11:16:36

原創

1131 人瀏覽過

閉包真的是學過一遍又一遍，Js博大精深，每次學習都感覺有新的收穫。相信大家封裝前端插件時，閉包是不可或缺的。閉包的真正好處我個人認為除了封裝還是封裝，能帶個我們私有方法，和調用上的靈活方便，也會使你的程式碼對外的物件保持乾淨整潔。

進入正題

維基百科這樣定義了JS閉包：在計算機科學中，閉包（英語：Closure），又稱詞法閉包（Lexical Closure）或函數閉包（function closures），是引用了自由包（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的閉包及應用