es6模塊化基礎知識點

 

1、爲何需要模塊化：

    因爲隨着前端的代碼複雜度越來越高，代碼之間會容易有這三個問題（全局變量衝突、函數命名衝突、依賴關係混亂）

2、模塊化規範的進階歷史

    commonJS 、 AMD 、 CMD 到現在的 es6模塊

3、最初最簡單的模塊化源碼（jquery大量使用的也是這種方式）

    var module_special = ( function()  {

            Var a =  function() {};

            Var b = function() {};

            return { a , b}

    })();

    解決了內部可以訪問外部變量，但是外部不能訪問內部變量的問題

4、es6的具體實現

    （1）export  規定模塊對外接口

            export {a , b}                    對外接口是對象，包含各種變量

            export function fun() {}     對外接口是函數/類

    （2）import  輸入其它模塊提供的功能

            import { a, b} from “./file”        指定對象的變量

            import  * as file from “./file”     用file重命名代指所有的對象

    （3）export default     

            優點：優化export對外接口的缺陷，使用import引入可以任意起名

5、commonjs和es6模塊的差異

	commonjs	Es6
輸出	值的拷貝，是對象	值的引用（動態引用，無緩存）
生成時期	腳本運行完才生成	代碼靜態解析時生成
	運行時加載	編譯時輸出接口