关于module.exports
和exports
的区别,我已经在前一篇文章讲过,传送门。
在es5中,用module.exports
和exports
导出模块,用require
引入模块。
es6新增export
和export default
导出模块,import
导入模块。
一、在es6中的两种基本用法
新建两个文件:a.js
, b.js
。a.js
用于导出模块,b.js
用户导入模块。两个文件放在同一目录下。
- 第一种用法
export default
导出:
//a.js
const Programmer = {name: 'UncleFirefly',age:25}
export default Programmer
export default
导出对应的导入:
//b.js
import Programmer from './a.js'
- 第二种用法
export
导出:
//a.js
const uncle = {name: 'UncleFirefly',age:25}
const aunt = {name: 'AuntFirefly',age:25}
export {uncle, aunt}
export default
导出对应的导入:
//b.js
import {uncle, aunt} from './a.js'
二、区别
可以在a.js
中打印出module,通过打印的内容找到4种导出模块的区别。
-
exports
和module.exports
的区别
查看exports
和module.exports
的区别请移步至我的另一篇文章:点我移步。 -
export
和export default
的区别
//a.js
const Programmer = {name: 'UncleFirefly',age:25}
export default Programmer
console.log(module)
/*
//打印结果
{exports: {default:{age:25,name:'UncleFirefly'}, hot:{...}}
*/
//a.js
const uncle = {name: 'UncleFirefly',age:25}
const aunt = {name: 'AuntFirefly',age:25}
export {uncle, aunt}
/*
//打印结果
{exports: {aunt:{age:25,name:'AuntFirefly'},uncle:{age:25,name:'UncleFirefly'}, hot:{...}}
*/
从打印可以看出:
-
导出时
export
相当于把对象添加到module
的exports
中。export default
相当于把对象添加到module
的exports
中,并且对象的key叫default
。
-
导入时:
-
不带
{}
的导入
本质上就是导入exports
中的default
属性(注:如果default
属性不存在,则导入exports
对象)。 -
带
{}
的导入
本质上按照属性key值导入exports
中对应的属性值。
-
三、小tips
一般来说,module.exports
和exports
与require
对应。也就是用module.exports
和exports
导出的模块,则用require
导入。(不是绝对,如果代码支持es6,也可以用import引入)。
-----------------------------------------
module.exports和exports的区别
在学习Node.js
时,经常能看到两种导出模块的方式:module.exports
和exports
。
穿插一个必备小知识:在文件
a.js
中用exports
或module.exports
导出的对象(方法、变量),可以在另一个文件b.js
中通过require('./a')
引用。
module
和exports
是Node.js
给每个js文件内置的两个对象。可以通过console.log(module)
和console.log(exports)
打印出来。如果你在main.js
中写入下面两行,然后运行$ node main.js
:
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: '萤火虫叔叔'}
。
附上代码(在main.js中引入people.js):
//people.js
module.exports = {name: '萤火虫叔叔'};
exports = {name: '萤火虫老阿姨'};
//main.js
let people = require('./people');
console.log(people);//输出:{name: '萤火虫叔叔'}