1. 首頁 > 生活百科 > >

JavaScript之無題之讓人煩躁的模塊化

生活百科

我怎么記得我好像寫過相關類型的文章，但是我找遍了我的博客沒有～那就再寫一遍吧 ， 其實模塊化的核心內容也算不上是復雜，只不過需要整理一下，規劃一下罷了 。嘻嘻 。
開始寫標題的時候我就在糾結一件事情，就是，先吃喜歡吃的，還是后吃喜歡吃的，翻譯過來就是我應該先寫CommonJS和ES6 Module，還是先寫CMD和AMD 。嗯，我決定了，誰先做好了我就先吃誰 。
其實模塊化的緣由很簡單，就一句話，不對，就一個詞，兩個字，分類 。如果一定讓我在加一點，那應該是“隔離” 。沒了～～但是這么少不太好，我舉個可能不那么恰當的例子吧 。
剛開始這個世界上只有三個人，起名字的時候會“刻意”的避開彼此已經叫過的名字 ， 他們在一起生活，日子欣欣向榮，一片美好，對未來充滿了期待 。
時間飛逝，三個人變成了三十人 ， 他們勉強還是住在一起 ， 擴建了房屋 ， 起名字的時候雖然費事一點，但是也還能不重復，日子還是欣欣向榮，一片美好，對未來充滿了期待 。
【JavaScript之無題之讓人煩躁的模塊化】時間又飛逝，三十人變成了三百人，那這不太好管理了，于是三位首領就說，你們有領導能力的幾個人站出來，組成各自的部落 ， 去吧，我相信你們可以的 。于是每個部落住在一起，部落與部落之間的人可以重名，叫名字的時候再加上一個部落的名稱唄 ， 嗯~又一片欣欣向榮 。
時間繼續飛逝，三百人變成了三千人，這三千人住在幾個大部落里也很不方便，你拿我的蘋果，我偷了你得豬 ， 這肯定不行，有礙于社會的穩定發展，于是三個創始者叫上部落的組長說，我們給每個人分一塊地，蓋一個房子，把三五個人分割成一個家庭，家庭之間由部落作為紐帶，關聯彼此，在形式上又相互獨立，不可以隨便拿別家的蘋果 。很完美~
時間飛飛飛飛逝，三千人變成了三百萬人……我們需要法律了 。
OK，上面的小例子 ， 人，就是函數，部落就是命名空間，房子就是IIFE，法律就是后續發展的模塊化規范 。那么我們依照上面的描述，如何轉換成代碼？
一、社會的起源與法律的雛形最開始的時候 ， 瀏覽器只需要簡單的圖文展示就是可以了，沒什么復雜的交互和邏輯的處理，所以，當我們只有三個人的時候，我們可以很自由，很隨意：
function a(){}function b(){}隨著Web的發展 ， 交互的增多，項目的擴大，很容易有人也聲明了同樣名稱的函數，于是紛爭開始了，那咋解決紛爭呢？嗯，命名空間也就是拆分部落 ， 就像這樣：
var zaking1 = {a:function(){},b:function(){}}var zaking2 = {a:function(){},b:function(){}}但是這樣并不能真正的解決問題，因為雖然從形式上區分了部落，但是部落之間沒有任何的隔離，部落內部也是混亂的，所以各個首領就制定了一個方案 ， IIFE，利用閉包的特性，來實現數據的隔離 ， 暴露出對外的入口：
var module = (function () {var name = "zaking";function getName() {console.log(name);}return { getName };})();module.getName();我們蓋好了房子 ， 還給房子建好了可以出入的門，但是我怎么邀請別人進來呢？
var module = (function (neighbor) {var name = "zaking";function getName() {console.log(name + "和鄰居：" + neighbor);}return { getName };})("xiaowangba");module.getName();傳個參數唄 ， 這就是依賴注入 。在這個階段，最有代表性的就是jQuery了，它的封閉性的核心實現，跟上面的代碼幾乎無異 ， 我們可以看下jQuery的模塊的實現：
(function (global, factory) {factory(global);})(typeof window !== "undefined" ? window : this, function (window, noGlobal) {if (typeof noGlobal === "undefined") {window.jQuery = window.$ = jQuery;}return jQuery;});當然我這里略了很多 ， 你看它，無非就是一個閉包，傳入了window和jQuery本身 ， 然后再綁定到window上，這樣 ， 我們就只能訪問到暴露出來的$以及$上的方法和屬性，我們根本無法修改內部的數據 。
OK，到了這個階段，其實算是一個轉折點，我們有了初步的法律，還需要后續針對法律的完善，
二、法律的初現與CommonJs隨著社會的發展，出現一種規則已成必然，于是commonJs統領舉起模塊化的大旗，讓JavaScript邁向了另一個階段 。commonJs最初由 JavaScript 社區中的 Mozilla 的工程師Kevin Dangoor在Google Groups中創建了一個ServerJs小組 。該組織的目標是為web服務器、桌面和命令行應用程序以及瀏覽器構建JavaScript生態系統 。嗯 ， 它的野心很大~，后來，他就就把ServerJs改成了commonJs，畢竟ServerJs的范圍有點?。?commonJs更符合他們的初衷 。

推薦閱讀