js-模塊化AMD vs CMD
1. AMD和require.js
define(function () { var basicNum = 0; var add = function (x, y) { return x + y; }; return { add: add, basicNum :basicNum }; }); // 定義一個(gè)依賴underscore.js的模塊 define(['underscore'],function(_){ var classify = function(list){ _.countBy(list,function(num){ return num > 30 ? 'old' : 'young'; }) }; return { classify :classify }; }) // 引用模塊,將模塊放在[]內(nèi) require(['jquery', 'math'],function($, math){ var sum = math.add(10,20); $("#sum").html(sum); });
2. CMD和sea.js
/** AMD寫法 **/ define(["a", "b", "c", "d", "e", "f"], function(a, b, c, d, e, f) { // 等于在最前面聲明并初始化了要用到的所有模塊 a.doSomething(); if (false) { // 即便沒(méi)用到某個(gè)模塊 b,但 b 還是提前執(zhí)行了 b.doSomething() } }); /** CMD寫法 **/ define(function(require, exports, module) { var a = require('./a'); //在需要時(shí)申明 a.doSomething(); if (false) { var b = require('./b'); b.doSomething(); } }); /** sea.js **/ // 定義模塊 math.js define(function(require, exports, module) { var $ = require('jquery.js'); var add = function(a,b){ return a+b; } exports.add = add; }); // 加載模塊 seajs.use(['math.js'], function(math){ var sum = math.add(1+2); });
總結(jié):AMD推崇依賴前置、提前執(zhí)行,CMD推崇依賴就近、延遲執(zhí)行
1. ES6的模塊不是對(duì)象,import命令會(huì)被 JavaScript 引擎靜態(tài)分析,在編譯時(shí)就引入模塊代碼,而不是在代碼運(yùn)行時(shí)加載,所以無(wú)法實(shí)現(xiàn)條件加載。也正因?yàn)檫@個(gè),使得靜態(tài)分析成為可能。
參考:http://www.rzrgm.cn/chenwenhao/p/12153332.html

浙公網(wǎng)安備 33010602011771號(hào)