seajs官網說：seajs是一個模塊加載器，所以學習它并不難。

在我的理解就是：本來我們是需要手動創建 script標簽 引入 js文件的，但用seajs后，它就自動幫我們完成這些工作。

?

?這里只說實現原理，具體使用請看seajs官網：http://seajs.org/docs/

下面總結一下：

1. sea.js 是怎樣解決 模塊加載(這里說的模塊其實就是js文件加載)，

2.?sea.js 是怎樣解決?模塊依賴

3. sea.js 是怎樣解決?命名沖突

?

1.模塊加載

　　其實，原理很簡單，和手動引入js文件是一樣的。

　　就是當調用有加載功能的函數 如 seajs.use 、 require 、require.async 時，

　　其內部代碼會創建一個script標簽，把src設置成你要引入的js文件，然后append到DOM文檔中進行加載，

　　當加載完畢后，再把這個script標簽移除掉，所以當我們審查元素時看不到有那個<script>標簽，

　　但因為文件已經引入了，即使把這個script移除也不會影響代碼使用.

　　我們可以用360衛士限制網速的功能，把網速降低，然后引入jq,是可以看到它就是這樣處理的

　　

加載完畢后，sea.js會把這個script標簽移除：

總的一句 ： 就是利用 script 標簽進行模塊加載

?

2.模塊依賴

　　上面的問題清楚了，其實這個依賴也很簡單啦，也就是 加載 順序的問題。

　　例如 a.js 依賴于 b.js， 那在sea.js內部代碼中，就先加載b.js然后再加載a.js，這樣就可以解決依賴問題了。

?

3.命名沖突

　　解決了上面的兩個問題，就剩下依賴接口的問題了， 就是模塊的依賴是搞定了，但是sea.js是用define( fn )函數來定義模塊的，里面的變量都是局部的，

　　得給外面一個接口調用才行啊。

　　so, ?exports對象就出場啦， 當你使用sea.js定義一個模塊的時候，你可以把你的 對外函數接口 都放在exports對象上，　　如：?

1 define(function (require, exports, module){ 2 var arr = [12,3,4,5,56]; 3 var method = function (){ 4 //code... 5 } 6 exports.arr = arr; //對外接口 7 exports.method = method; //對外接口 8 })

當別一個文件要依賴此文件時， 調用 require( url )時，返回值就是這個exports對象，所以就解決了接口的問題。

同時也很好的解決了命名沖突的問題，就算幾個同事都用一樣的名字，也不會有問題。

因為這里返回的exports就相當于一個命名空間了。

轉載于:https://www.cnblogs.com/aaa6818162/p/4511692.html

總結

以上是生活随笔為你收集整理的模块化开发之sea.js实现原理总结的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。