module.exports和exports export和export default的区别

一、module.exports和exports 的区别

CommonJS规范，经常能看到两种导出模块的方式：module.exports和exports。

console.log(exports);//输出：{}
console.log(module);//输出：Module {..., exports: {}, ...} （注：...代表省略了其他一些属性）

从打印我们可以看出，module.exports和exports一开始都是一个空对象{}，实际上，这两个对象指向同一块内存。这也就是说module.exports和exports是等价的（有个前提：不去改变它们指向的内存地址）。
例如：exports.age = 18和module.export.age = 18，这两种写法是一致的（都相当于给最初的空对象{}添加了一个属性，通过require得到的就是{age: 18}）。

但是

require引入的对象本质上是module.exports。这就产生了一个问题，当 module.exports和exports指向的不是同一块内存时，exports的内容就会失效。
例如：

module.exports = {name: '萤火虫叔叔'}；
exports = {name: '萤火虫老阿姨'}

此时module.exports指向了一块新的内存（该内存的内容为{name: ‘萤火虫叔叔’}），exports指向了另一块新的内存（该内存的内容为{name: ‘萤火虫老阿姨’}）。require得到的是{name: ‘萤火虫叔叔’}。

二、export和export default 的区别

• export default

  export default导出

  //a.js
  const Programmer = {name: 'UncleFirefly',age:25}
  export default Programmer
  

  导入

  //b.js
  import Programmer from './a.js'
  

• export

  export导出

  //a.js
  const uncle = {name: 'UncleFirefly',age:25}
  const aunt = {name: 'AuntFirefly',age:25}
  export {uncle, aunt}
  

  导入

  //b.js
  import {uncle, aunt} from './a.js'