記錄關於js模塊的淺薄探索（一）——從別人博客中的理解

沒錯，我以前的博客都沒寫完，我又挖了一個坑！！ 以前一直在圍繞着 vue webpack es6 之類的亂七八糟的東西打轉，可是一無所得。今天忽然又在想，webpack到底幹嗎用的，一直在說管理資源啊，打包啊什麼的，可是都不懂，今天看了幾篇別人的博客，而後想記錄一下本身的心路歷程。由於工做室學前端都是把 html+css+js學一下就完了，我的以爲這樣的學習註定了可能之後沒有人會去學前端，而且學習了也可能對之後的一些規範項目開發不清楚（其實我也不清楚...） 因此想本身多看看大佬們的博客，而後對前路有一個清晰一點點的規劃！ （豪情壯志啊 個人天，哪裏來的這麼大的膽子）

先來看一個博客
http://www.javashuo.com/article/p-crafzvxy-z.html // 淺談前端js模塊化演變 來自博客園的 peter_zhou（晴空）
這篇博客講了一個模塊化演變過程， 能夠簡單看一下，瞭解一下
-----
那麼爲何要模塊化，其實這個博客也講了，那麼還有一個博客詳細的講了一下緣由
http://www.cnblogs.com/haoxl/p/5492692.html // 來自博客園的 haoxl 裏面有個demo講了緣由

簡單歸納就是很直白的緣由，你跟別人一塊兒作項目的時候，可能會有命名衝突，因而就像博客demo同樣

var module1={};
module1.fn={};
module1.fn.Utils={};
module1.fn.Utils.module=function(){
    console.log("I am module1.js");
}

一層一層的定義 ，就像java裏解決命名空間的方法同樣， 查資料看有說 實際上，Java設計者是但願程序員反過來使用本身的 Internet域名，由於這樣能夠保證它們確定是獨一無二的。（以前看網課視頻的時候，好比極客，老師命名就喜歡是 com.jike.xx.xx）反轉域名後，句點就用來表明子目錄 [ 這裏的js的寫法就能感受到子目錄的那種feel ] 的劃分。所以，如今整個包名都是小寫了。Java2 的這種機制意味着全部的文件都可以自動存活於它們本身的名字空間內，並且同一個文件內的每一個類都有惟一的標識符。這樣就算咱們兩我的用的方法同樣，我import不同的包 去調用方法，沒啥大問題 ，若是還怕重複，大不了，我能夠加上本身名字縮寫 哈哈哈。

此處插一個關於C++命名空間的介紹 ，畢竟這個詞是從這裏來的
C++類( Java 類基於此)將函數包於其內，從而避免了與其它類中的函數名衝突。然而，C++仍容許全局數據和全局函數的存在，因此仍是有可能發生衝突。
爲了解決這個問題，C++經過幾個關鍵字，引入了「名字空間」的概念。

關於模塊化具體怎麼使用，以及機制 後續再貼

第二個緣由，也講的很清楚，就是文件依賴問題。關於依賴，最多見的就是我js引用的那個順序，到底怎麼擺放，不少時候報錯都是由於順序問題致使的，好比我後面有本身寫的js文件裏用了"$" 可是不起效果，那極可能是我網頁先加載的它後加載的JQ ，上次幫徒弟找bug 連着幾個報錯都是由於順序有誤致使的（博客裏說到的Bootstrap也很是典型）這就是咱們平時接觸到最頻繁的依賴問題
以前用webpack的時候就不用再index.html裏寫

刷新評論 刷新頁面 返回頂部