module.exports
Node應用由模塊組成,采用CommonJS模塊規范。根據這個規范,每個文件就是一個模塊,有自己的作用域。在這些文件里面定義的變量、函數、類,都是私有的,對外不可見,因此規避掉了作用域污染。
根據CommonJS規定,每個模塊內部,module變量代表當前模塊,這個變量是一個對象,它的exports屬性(即module.exports)是對外的接口。加載某個模塊,其實就是加載該模塊的exports屬性。
舉例:通過module.exports輸出變量 age 和 sayHelloTo 函數。
./MyModule.js
var age = 7;
var sayHelloTo= function (name) {
return "hello " + name;
};
module.exports.age = age;
module.exports.sayHelloTo=sayHelloTo;
require:用于加載模塊
var temp = require('./MyModule.js'); //這里也可以使用 import myModule from './MyModule.js'
console.log(temp.age); // 7
console.log(temp.sayHelloTo("Steve")); // hello Steve
額外說明:對于自定義的模塊,需要使用相對路徑,否則會提示找不到模塊/組件(默認情況下,非相對路徑的引用,會從node_modules文件夾中查找)
exports 與 module.exports
為了方便,node為每個模塊提供了一個exports變量,指向module.exports。這等同于在每個模塊頭部,有這么一行代碼:
var exports = module.exports;
因此,我們可以直接在exports對象上添加方法(等同于在 module.exports 添加一樣)
./MyModule.js
var age = 7;
var sayHelloTo= function (name) {
return "hello " + name;
};
exports.age = age; //等效于: module.exports.age = age;
exports.sayHelloTo=sayHelloTo; //等效于: module.exports.sayHelloTo=sayHelloTo;
P.S.不能直接將exports指向一個值,這會切斷 exports 與 module.exports 的聯系(但是可以用module.exports來指向一個值)
./MyModule.js
var age = 7;
var sayHelloTo= function (name) {
return "hello " + name;
};
exports = age; //不要這么干。這么做會切斷exports與module.exports的聯系
不同于CommonJS,ES6使用 export 和 import 來導入、導出模塊
用 export 導出的模塊,需要用 import 來進行導入,而不能用 require。
P.S.:export 命令規定的是對外的接口,必須與模塊內部的變量建立一一對應的關系
const utils = {
showSth : function(){
console.log("showSth");
},
saySth : function(){
console.log("saySth");
}
}
//導出的3種方式
export var m = utils; // 方式1,這種方式在引用的時候需要這樣: import {m} from './utils.js';
export {utils}; // 方式2,用大括號來導出變量,如果導出的變量有多個,則{變量1,變量2,變量3...,變量N}。這種方式在引用的時候需要這樣: import {utils} from './utils.js';
export {utils as myUtils}; // 方式3,這種方式在引用的時候需要這樣: import {myUtils} from './utils.js';
在引用的地方,也可以直接指定別名,如:import {myUtils as utils} from './utils.js';
MDN對于export和import的語法說明:
export語法:
export { name1, name2, …, nameN };
export { variable1 as name1, variable2 as name2, …, nameN };
export let name1, name2, …, nameN; // also var, const
export let name1 = …, name2 = …, …, nameN; // also var, const
export function FunctionName(){...}
export class ClassName {...}
export default expression;
export default function (…) { … } // also class, function*
export default function name1(…) { … } // also class, function*
export { name1 as default, … };
export * from …;
export { name1, name2, …, nameN } from …;
export { import1 as name1, import2 as name2, …, nameN } from …;
export { default } from …;
import語法:
import defaultExport from "module-name";
import * as name from "module-name";
import { export } from "module-name";
import { export as alias } from "module-name";
import { export1 , export2 } from "module-name";
import { export1 , export2 as alias2 , [...] } from "module-name";
import defaultExport, { export [ , [...] ] } from "module-name";
import defaultExport, * as name from "module-name";
import "module-name";
var promise = import(module-name);
export 和 export default
- export 和export default 均可用于導出(常量 | 函數 | 文件 | 模塊)等。
- 可以在其他文件中通過 import+(常量 | 函數 | 文件 | 模塊)名的方式,將其導入,以便能夠進行使用。
- 在一個文件或者模塊中,export、import 可以有多個,但 export default 僅有一個。
const utils = { showSth : function(){ console.log("showSth"); }, saySth : function(){ console.log("saySth"); } } const name = "my name is Artech"; export {name}; //命名導出 export {utils}; 對于命名方式導出的,在導入的時候必須使用相應對象的相同名稱 引用的時候:import {utils,name as myName} from './utils.js';
- 通過 export 方式導出,在導入時要用花括號{ };而通過 export default 方式導出的,則不需要:
如通過 export default 導出 export default utils; 則在使用的時候不用加花括號,且導入時的名字可以自定義,如: import myUtils from './utils.js'; 對于默認方式導出的,則導入的時候,名稱可以隨便取 默認導出:不能使用 let,var 或 const 作為默認導出
import *
將一個js文件中定義的方法,模塊,對象等,全部導出,一般結合別名使用,如:
myModule.js
export const fun1 = ()=>{}
export const objInfo = {...};
demo.js:引用mymODULE。JS
import * as myAlias from './myModule';
//fun1()和objInfo都是定義在myModule中的方法和對象
myAlias.fun1();
myAlias.objInfo;