• js的模塊化

  在前端開發的原始時期，只要在script標簽中嵌入js代碼就能實現一些基本的交互效果，但是隨著時代的進步。js扮演的角色變得重要起來，js應用的場景頁越來越復雜，。然而，js都沒有類的概念，更不用說模塊了。

  為什麽要有模塊化

  1. 當一個項目變得復雜的時候，會出現問題，比如：
     命名沖突：開發中重復命名，導致命名沖突。
     文件依賴：項目開發中，依賴的js文件，引入遺漏，引入順序錯誤。

  2. 使用模塊化開發可以避免類似情況，而且利於項目的維護：
     提升開發效率：代碼方便重用，能直接引入，避免重復開發。
     方便後期維護：維護起來文件依賴和結構清晰

• AMD
  AMD 英文Asynchronous Module Definition，中文“異步模塊定義”。它是一個在瀏覽器端模塊化開發的規範。AMD規範的主要實現是RequireJs

define(id?, dependencies?, factory)
id：指定義中模塊的名字（可選）。如果沒有提供該參數，模塊的名字應該默認為模塊加載器請求的指定腳本的名字。如果提供了該參數，模塊名必須是“頂級”的和絕對的（不允許相對名字）。
dependencies：當前模塊依賴的，已被模塊定義的模塊標識的數組字面量（可選）。
factory：一個需要進行實例化的函數或者一個對象。   

   define("alpha", ["require", "exports", "beta"], function (require, exports, beta) {
       exports.verb = function() {
           return beta.verb();
           //Or:
           return require("beta").verb();
       }
   });
 

• CMD
  CMD 英文 Common Module Definition。CMD 依賴就近。CMD規範的主要實現是SeaJs

    define(function(require, exports, module){ 模塊代碼 });
    

• commonjs
  CommonJS是服務器端模塊的規範，Nodejs使用該規範。
  CommonJS定義，一個單獨的文件就是一個模塊。每一個模塊都是一個單獨的作用域，在該模塊內部定義的變量，無法被其他模塊讀取，除非定義為global對象屬性。
  通過 require 來加載模塊。
  commonJs通過 exports 和 modul.exports 來暴露模塊中的內容。

• es6的module 語法
  一個模塊就是一個獨立的文件。該文件內部的所有變量，外部無法獲取。
  export 命令用於規定模塊的對外接口。
  import 命令用於輸入其他模塊提供的功能。

  // profile.js
  export var firstName = ‘Michael‘;
  export var lastName = ‘Jackson‘;
  export var year = 1958;
  // main.js
  import {firstName, lastName, year} from ‘./profile‘;
  
  function setName(element) {
    element.textContent = firstName + ‘ ‘ + lastName;
  }

amd cmd commonjs 模塊規範 和 es6 的 module 語法