exports、module.exports和export、export default的區別

1. 使用範圍

require: node 和 es6 都支持的引入
export / import : 只有es6 支持的導出引入
module.exports / exports: 只有 node 支持的導出

2. node模塊

CommonJS定義的模塊分爲: 模塊標識(module)、模塊定義(exports) 、模塊引用(require)

exports 和 module.exports
在一個node執行一個文件時,會給這個文件內生成一個 exports和module對象,
而module又有一個exports屬性。他們之間都指向一塊{}內存區域。
exports = module.exports = {};

exports 和 module.exports 的使用

如果要對外暴露屬性或方法,就用 exports 就行,要暴露對象(類似class,包含了很多屬性和方法),就用 module.exports。

//utils.js
let a = 100;

console.log(module.exports); //能打印出結果爲:{}
console.log(exports); //能打印出結果爲:{}

exports.a = 200; //這裏辛苦勞作幫 module.exports 的內容給改成 {a : 200}

exports = '指向其他內存區'; //這裏把exports的指向指走

//test.js

var a = require('/utils');
console.log(a) // 打印爲 {a : 200} 

從上面可以看出,其實require導出的內容是module.exports的指向的內存塊內容,並不是exports的。
簡而言之,區分他們之間的區別就是 exports 只是 module.exports的引用,輔助後者添加內容用的。

3. ES中的模塊導出導入

export 和 export default

首先我們講這兩個導出,下面我們講講它們的區別

export與export default均可用於導出常量、函數、文件、模塊等
在一個文件或模塊中,export、import可以有多個,export default僅有一個
通過export方式導出,在導入時要加{ },export default則不需要
export能直接導出變量表達式,export default不行。

testEs6Export.js
'use strict'
//導出變量
export const a = '100';  

 //導出方法
export const dogSay = function(){ 
    console.log('wang wang');
}

 //導出方法第二種
function catSay(){
   console.log('miao miao'); 
}
export { catSay };

//export default導出
const m = 100;
export default m; 
//export defult const m = 100;// 這裏不能寫這種格式。
index.js
//index.js
'use strict'
var express = require('express');
var router = express.Router();

import { dogSay, catSay } from './testEs6Export'; //導出了 export 方法 
import m from './testEs6Export';  //導出了 export default 

import * as testModule from './testEs6Export'; //as 集合成對象導出



/* GET home page. */
router.get('/', function(req, res, next) {
  dogSay();
  catSay();
  console.log(m);
  testModule.dogSay();
  console.log(testModule.m); // undefined , 因爲  as 導出是 把 零散的 export 聚集在一起作爲一個對象,而export default 是導出爲 default屬性。
  console.log(testModule.default); // 100
  res.send('恭喜你,成功驗證');
});
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章