ES6 和commonJs 区别

99 阅读1分钟

ES6 模块 (ECMAScript Modules, ESM) 和 CommonJS (CJS) 是 JavaScript 中两种主流的模块系统,它们的设计理念、语法和运行机制有显著区别。以下是它们的核心异同点:


核心区别

特性ES6 模块 (ESM)CommonJS (CJS)
设计目标浏览器 + 服务器通用标准 (ECMAScript 规范)Node.js 服务器端设计
加载时机静态编译时解析 (import/export)动态运行时加载 (require/module.exports)
语法import/export (声明式语法)require()/module.exports (函数/对象赋值)
模块对象只读的"活绑定" (导出值变化会影响导入值)导出值的拷贝 (导入后与原模块解耦)
加载方式异步加载(浏览器),支持 top-level await同步加载(Node.js 原生实现)
文件扩展名.mjs.js (需在 package.json 中设置 "type": "module").cjs.js (默认)
this 指向顶层 thisundefined顶层 this 指向 module.exports
Tree Shaking支持(静态分析可删除未使用代码)不支持(动态依赖难以静态分析)
循环依赖处理更健壮(通过"活绑定"解决)可能引发问题(依赖执行顺序敏感)