es6和commonjs模块化规范的深入理解

两个西柚呀2025-12-20 12:02

总结：两种方式都是使用一个对象作为对外接口，es6使用的是Module这个实例对象，commonjs使用的是module.exprots这个对象。不同的是Module这个实例对象是不能直接操作的，而module.exports这是我们可以直接在js中操作的一个对象。

ES6模块化：

javascript 复制代码

const a = 1

function add(x,y) {
    return x+y
}

export {a}  // 注意这里并不是导出一个对象，而是导出数据的列表

export default add

将其在另一个模块中引入并打印在控制台的结果：

很容易看出，实际上export 和 export default做的事情并不是导出数据，而是向Module这个对象中添加数据。

CommonJS模块化：

这个规范的导出方式其实都是在操作module.exports这个对象，exports实际上只是提供的一个简写，exports也是指向module.exports这个对象的，我们可以直接操作这个对象，往这个对象里面添加属性，或者直接module.exports = {}，直接导出一个新的对象。

两者的导入表象上来看都是从对象身上解构数据，es6模块化是从Module这个对象身上解构，commonjs是从module.exports这个对象上解构。但是冲命名的方式不一样，es6是as语法，commonjs是：