[TOC] ## ES6 模块与 CommonJS 的差别 使用es6的模块方法,要比node中 的(也就是CommonJS模块)方法更加的差异非常大 主要有如下两点差别: 1. CommonJS 模块输出的是一个值的拷贝,ES6 模块输出的是值的引用。 2. CommonJS 模块是运行时加载,ES6 模块是编译时输出接口。 ## ES6 [推荐] ### 命名导出 ``` //导出 export const demo="demo" export const hello=()=>{ console.log("hello") } //导入 import {demo,hello} from "@/common/request.js" console.log(demo) hello() ``` ### 默认导出 导出 ``` const demo ="demo" const hello=()=>{ console.log("hello") } // es6 的缩写 export default {demo,hello} //等价于 export default { demo:demo, hello:hello } ``` 导入 ``` // 无法使用 {demo} 导出 import req from "@/common/request.js" console.log(req.demo) req.hello() ``` ## CommonJS 模块 node中的module都遵循CommonJS规范。在CommonJS中有一个全局的require()方法,用于加载模块;`module.export`和`export`方法,导出模块 这里比较重要的一点是: 我们在写模块时用到的`exports`对象实际上只是对`module.exports`的引用,所有在一些js库的源码中,经常可以看到这样的写法: `exports = module.exports = somethings` ### export ``` //导出 const export2 = ()=> { console.log("from export2") } exports.export2 = export2; exports.export3 = ()=> { console.log("from export3") } //导入 const req = require("@/common/request.js") req.export2() req.export3() ``` ### module.exports ``` //导出 const export2 = ()=> { console.log("from export2") } module.exports.export2 = export2; module.exports.export3 = ()=> { console.log("from export3") } //导入 const req = require("@/common/request.js") req.export2() req.export3() ```