关于js中的模块导出导入

2018-09-29

在写 js 时,我们经常会通过 require 导入一个模块,通过 export ,export default ,module.exports 导出一个模块,在写代码的过程中想查阅一下其中的区别,并做一个记录。

CommonJS

首先我们先来说一下 CommonJS,node 里面的模块遵守的就是该规范。 CommonJS 定义的模块分别为:模块标识(module)、模块定义(exports)、模块引用(require) Node 应用由模块组成,采用 CommonJS 模块规范。

exports 和 module.exports

在运行一个 node 文件时,会给这个文件内部生成一个 exports 和 module 对象。而 module 又有一个 exports 属性。 exports = module.exports = {}

1042726218-597aee464dc71_articlex.png | center | 596x166

他们都指向同一块内存区域

# test.js
let a = 100
console.log(module.exports); //能打印出结果为:{}
console.log(exports); //能打印出结果为:{}

exports.a = 300;  // 修改module.exports的内容 他仅仅是辅助修改module.exports内存块内容

# test2.js
let b = require('./test.js')
console.log(b) // {a:300}

export 和 export default

  1. export 与 export default 均可用于导出常量、函数、文件、模块等
  2. 你可以在其它文件或模块中通过 import+(常量 | 函数 | 文件 | 模块)名的方式,将其导入,以便能够对其进行使用
  3. 在一个文件或模块中,export、import 可以有多个,export default 仅有一个
  4. 通过 export 方式导出,在导入时要加{ },export default 则不需要

export

// 导出方式
export const str = 'ChangJun'
export function getName(name) {
  return name
}

// 对应的导入方式
import { str, getName } from 'test'

export default

// 导出方式
const str = 'ChangJun'
export default str

// 对应的导入方式
import str from 'test'

// 使用export default命令,为模块指定默认输出,这样就不需要知道所要加载模块的变量名
// 一个文件内只能有一个export default