簡單介紹不同規(guī)范
- CommonJS規(guī)范和AMD規(guī)范
運(yùn)行時(shí)加載
// CommonJS模塊
let { stat, exists, readFile } = require('fs');
// 等同于
let _fs = require('fs');
let stat = _fs.stat;
let exists = _fs.exists;
let readfile = _fs.readfile;
上述代碼：
① 整體加載fs模塊域慷，生成一個(gè)fs對象
② 然后在這個(gè)對象上讀取方法
這種加載荒辕，稱之為 運(yùn)行時(shí)加載
- ES6 模塊：es6模塊不是對象，而是通過export顯示輸出的代碼片段芒粹，在通過import方式輸入
編譯時(shí)加載
// ES6模塊
import { stat, exists, readFile } from 'fs';
上述代碼：
① 從fs模塊加載三個(gè)方法兄纺，其他方法不加載（按需加載）
這種加載，稱為編譯時(shí)加載或者靜態(tài)加載
言歸正傳——ES6模塊
- 語法
export 用于規(guī)定模塊對外的接口
- export 變量名|函數(shù)|類（class）| export { 變量1,變量2,變量3...}
①輸出變量
// profile.js
export var firstName = 'Michael';
export var lastName = 'Jackson';
export var year = 1958;
或者
// profile.js
var firstName = 'Michael';
var lastName = 'Jackson';
var year = 1958;
export { firstName, lastName, year };
②輸出函數(shù)
export function multiply(x, y) {
return x * y;
};
或者
function multiply(x, y) {
return x * y;
};
export {multiply}
③輸出對象
export class A{
}
- as 對輸出的變量重命名
// profile.js
var firstName = 'Michael';
var lastName = 'Jackson';
var year = 1958;
//用as重命名firstname
export { firstName as ftname, lastName, year };
- 整體加載模塊
export * as 變量名 from ‘模塊‘化漆； - export default
// modules.js
function add(x, y) {
return x * y;
}
//具名接口改為默認(rèn)接口
export {add as default};
// 等同于
// export default add;
// app.js
//輸入模塊的默認(rèn)接口并且重命名為foo
import { default as foo } from 'modules';
// 等同于
// import foo from 'modules';
import 用于輸入其他模塊提供的功能
- 語法
import { 變量名1,變量名2,變量名3...} from '模塊'
變量名必須和模塊提供的對外接口名一致
