JS模块导入导出大全——module.exports、exports、export和export default的使用和区别

一、介绍

1.module.exports 和exports 是commonjs的规范

2.export 和export default 是es6 规范

3.require 是amd规范引入方式

4.import 是es6 的一个语法标准

二、module.exports 和exports的使用

 module 变量代表当前模块，这是个对象，会创建exports的属性，属性的默认值是空对象

//导出使用方法：
function add(a,b) {
    return a+b;
}
var a1 = 1
module.exports = {add,a1};
module.exports = {a:1};
module.exports .a = 1
module.exports = function(name,age,money) {
    this.name = name;
    this.age = age;
    this.money = money;
    this.say = function() {
      console.log('我的名字叫：'+this.name+'，我今年'+this.age+'岁，月薪为：'+this.money+'元；')
    }
  };

//导入使用方法
var req = require ('../app.js');
console.log(req.a1,req.a)
const {add,a1} = require('../app.js')

 exports 是module.exports的一个引用，可以认为是 var exports = module.exports

exports.a = 1;
exports.add = add
//导入使用方法
var req = require ('../app.js');
console.log(req.a)

三、module.exports 和exports的区别

1.相对而已，exports不能导出匿名函数（比如没有变量名的函数）也不能写 exports = {add};

2.exports是引用 module.exports的值。module.exports 被改变的时候，exports不会被改变，而模块导出的时候，真正导出的执行是module.exports，而不是exports。

3.Require 引入模块后，放回给调用者的是module.exports 而不是exports

module.exports = {name: '叔叔'}；
exports = {name: '阿姨'}
//main.js
let people = require('./people');
console.log(people);//输出：{name: '叔叔'}

export和export default 的使用

 export default导出的例子

var name = 'javk'
var sys = function () {
    console.log('test')
}
var name1;
//一个模块文件只能有一个export default,下面是举例而已
export default { name , sys}
export default const name3 = 'error'; //这个是错误的，可以用下一行这种方式
export default name1 = 'marry'
export default { name2: 'bob'} //暴露一个对象
export default  function() {
    console.log ('export 不能这样子')
}
//引入
import test from 'app.js' // test可以随便取名字，不需要花括号

 export 导出的例子

export {age,open} //等同于下边
export {age}
export {open}
export const age1 = 23 //let 也行

export class User {
    constructor(name) {
      this.name = name;
    }
  }
  export function log(sth) { //不能没有函数名字
    return sth;
}

//导入方法 对应导入的变量或函数，一定要花括号
import {age,open} from "app.js" // 花括号里面的值必须好暴露的变量相同
import {age1 as age2} from "app.js"
import * as test from "app.js"

 export和export default 的区别

export default 在一个模块中只能有一个，也可以没有，export可以有很多个

export default 的对象、变量、函数、类、 可以没有名字，但export导出的必须有名字

两者导出，用import导入对应会有区别。

这篇主要写的是js导入导出如何具体使用，没涉及什么原理性知识，如有什么错误，请多多指出，谢谢支持！！！