CommonJS (exports、module.exports) 与 ES6(export、export.default)之间的区别

232 阅读2分钟
  • CommoJS 模块规范和 ES6 模块规范是两个不同的概念

CommonJS 模块规范

  • 使用 exports 、module.exports导出、require 导入模块 1:每一个文件代表一个模块,该模块有自己的作用域,在当前文件中可以定义其私有信息:变量、函数、类...(私有信息顾名思义:仅当前文件可见、可用,其他文件不可)

2:每一个模块都可以使用变量 module 来代表,变量 module 是一个对象,他的 exports 属性(即:module.exports)是连接其他模块的接口。

3:加载某一个模块,相当于加载当前模块的 module.exports 属性

//  a.js 
var name = '小明'
var inner = function() {
	return 'Hello World'
}
module.exports.name = name
module.exports.inner = inner

通过上述 module.exports.xxx 的方式 暴露出当前你想暴露的属性(在其他模块使用当前模块的属性)

使用 require 的方法加载需要的模块

// b.js
var obj = require('./a.js')
console.log(obj.name) //小明
console.log(obj.inner())// Hello World

exports 和 module.exports 之间的关系

Node 为每一个模块提供了一个 exports 变量来指向 module.exports 。

这相当于在每一个模块的头部添加了 一行如下命令

var exports = module.exports;

因此,在 exports 上添加属性,等同于在module.exports 上添加

注意: 因为 Node 是通过 module.exports 导出的,如果直接把exports 指向一个值,这样就切断了 exports 和module.exports 之间的联系

// 错误的写法:
// c.js
var str = 'Hello World'
exports = str

// d.js
const str = require('./c.js') // 空对象 {}
// 正确写法:
// c.js
var str = 'Hello World'
exports.str = str

// d.js
const str = require('./c.js') // Hello World

ES6模块规范

  • 使用 export、export.default 导出模块,import 引入模块
// e.js
var first = 1
var second = 2
export {first, second}

// f.js
// 引入方式一:
import {first, second} from './e.js'

// 引入方式二:
//  e.js 文件中所有变量 都绑定在 config 上
import {* as config} from  './e.js'
console.log(config.first) // 1
  • export 对外的接口需要与模块内部的变量保持一一对应
//导出方式一:
export const obj= {
	name: '小明',
	age: 20
}
//导出方式二:
var arr=[1, 3, 5]
export {arr}

export 与 export.default 之间区别

export 可以在当前导出多个变量

使用 export.default 即:当前模块指定默认输出(只可以输出一个)

var str = 'Hello World'
export.default str

exports 与 module.exports 可参考

nodejs.org/dist/latest…

nodejs.org/docs/latest…