最近在開(kāi)發(fā) quickjs-android，一個(gè)小型的 JavaScript 引擎封裝框架，需要給框架增加模塊加載能力，以提高框架的可用度，所以就模塊化能力對(duì)常用的模塊化規(guī)范展開(kāi)分析。

前言

目前常用的模塊規(guī)范有兩種，CommonJS 和 ES6 Module，Node.js 是基于 CommonJS 規(guī)范開(kāi)發(fā)的，使用的命令是 require 和 exports。而 ES6 是 JavaScript 的版本標(biāo)準(zhǔn)，2015.06 發(fā)版，使用 import 和 export 命令。

CommonJS 和 Node.js

CommonJS 是一種規(guī)范，而不是一個(gè)框架，可以理解為接口的概念，而 Node.js 是 CommonJS 的一種實(shí)現(xiàn)方式，所以 require、exports 并不是 Node.js 獨(dú)有的方法，任何的框架都可以實(shí)現(xiàn) CommonJS 規(guī)范，但是這不是標(biāo)準(zhǔn)的JavaScript規(guī)范，所以在瀏覽器上是無(wú)法實(shí)現(xiàn)。

ES6

ES6 也是一種 JavaScript 規(guī)范，與 CommonJS 不同，全稱 ECMAScript 6.0 ,是 JavaScript 版本標(biāo)準(zhǔn)，2015.06 發(fā)版。目前已經(jīng)被多數(shù)的瀏覽器支持，quickjs-android 也支持 ES6，Node.js 在 13.2.0 版本開(kāi)始也提供了支持。

用法區(qū)別

兩者的用戶很相似，都能夠?qū)崿F(xiàn)導(dǎo)入其它文件模塊。

CommonJS

a.js

module.exports.name = 'Hello world';
module.exports.age = 18;

b.js

var a = require('./a.js');
console.log(a.name);
console.log(a.age);

ES6 Module

a.js

export var name = 'Hello world';
export var age = 18;

b.js

import {name, age} from './a.js';
console.log(name);
console.log(age);

區(qū)別

CommonJS 模塊是運(yùn)行時(shí)調(diào)用，就算多次調(diào)用 require，對(duì)應(yīng)的模塊代碼不會(huì)重新執(zhí)行，而是使用之前的結(jié)果。而 ES6 是編譯時(shí)進(jìn)行，并且不會(huì)緩存運(yùn)行結(jié)果，而是動(dòng)態(tài)的去被加載的模塊取值，模塊里面的變量綁定其所在的模塊。

CommonJS

var a = require('./a.js');
a.gender = '男';
var a2 = require('./a.js');
console.log(a2.gender);

輸出結(jié)果是：男

最后

更多的用法請(qǐng)參考 CommonJS 、 ES6 Module。