【转】module.exports、exports、export、import、export default区别

版权声明：本文为CSDN博主「尼古拉斯-托尔斯泰-赵四」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/qq_31411389/article/details/83858990

————————————————

写在前面
这里涉及到CommonJs和Es6的知识，因此，想要充分的认识他们，少年，你需要修炼下CommonJs和Es6了。

进入正题
CommonJs规范：module.exports、exports
module.exports和exports 是commonJs的语法，大家熟知的node就是基于CommonJs语法设计的，node将每个文件视为一个拥有独立作用域链的模块，每个模块的类，变量，函数等都是私有的，对其他文件不可见。但是，如果别的模块想要使用另一个模块的函数应该如何处理呢，这时我们就会用到module.exports、exports了。
node将每个独立的文件视为一个mudule，而exports是为了将本模块内的变量函数暴露给外面使用的写在mudule对象上的接口，因此使用时可以通过module.exports来说暴露内部接口道外面：

// add.js
let a = 123;
let add = function (val) {
return val + a;
};
module.exports.a = a;
module.exports.add = add;

使用时：

// index.js
var add = require('./add.js');
console.log(add.a); // 123
console.log(add.add(1)); // 124

另外：

node为了方便使用会给每个模块头部提供一个exports变量，内部实现很简单var exports = module.exports;

因此，我们也可以，直接：
exports.add = add 将上面add.js的add函数暴露出去。

ES6模块规范：export、import、export default
Es6使用 export 和 import 来导出、导入模块

// index.js
var name = 'zhangsan';
var age = '12';
var sex = 'man';
export {name, age, sex};

或者

export default function () {
console.log('123123');
}

 

// 导出单个特性
export let name1, name2, …, nameN; // also var, const
export let name1 = …, name2 = …, …, nameN; // also var, const
export function FunctionName(){...}

// 导出列表
export { name1, name2, …, nameN };
// 重命名导出
export { variable1 as name1, variable2 as name2, …, nameN };

// 解构导出并重命名
export const { name1, name2: bar } = o;

// 默认导出
export default expression;
export default function (…) { … } // also class, function*
export default function name1(…) { … } // also class, function*
export { name1 as default, … };