贝利信息

JavaScript模块化开发怎么做_ES6模块与CommonJS有什么区别

日期:2026-01-02 00:00 / 作者:狼影
ES6模块与CommonJS本质差异在于加载机制和绑定行为:ES6依赖静态分析、实时绑定;CommonJS为动态执行、值拷贝。import必须顶层字面量,require可任意位置;混用需构建工具或Node桥接。

ES6模块(import/export)是现代JavaScript的标准模块方案,CommonJS(require/module.exports)是Node.js早期的运行时模块规范;二者不能直接混用,必须靠构建工具或Node运行时桥接——这不是语法偏好问题,而是加载机制、绑定行为和构建能力的根本差异。

为什么 import 不能放在 if 里,而 require 可以?

因为ES6模块依赖关系必须在代码执行前静态确定,解析器要靠它做tree-shaking、循环依赖分析和打包优化;import 只能在顶层作用域出现,任何条件判断、函数作用域或动态拼接路径都会报语法错误。

导出值变了,为什么 require 拿不到更新,而 import 可以?

CommonJS导出的是值的拷贝(对象除外,导出的是引用),ES6模块导出的是实时绑定的只读引用——这直接影响状态共享、单例行为和调试逻辑。

/* lib.cjs */
let count = 0;
function inc() { count++; }
module.exports = { count, inc };

/ app.cjs / const lib = require('./lib'); console.log(lib.count); // 0 lib.inc(); console.log(lib.count); // 0 ← 不变!因为导出的是初始值拷贝

/* lib.mjs */
export let count = 0;
export function inc() { count++; }

/ app.mjs / import { count, inc } from './lib'; console.log(count); // 0 inc(); console.log(count); // 4 ← 实时响应!绑定的是同一内存地址

在Node.js里混用ESM和CJS,怎么避免 require is not definedCannot import ESM module from CommonJS

Node.js 12+ 支持双模块系统,但默认不互通;强行混用会触发运行时错误。关键不是“能不能”,而是“怎么桥接”。

最常被忽略的一点:模块系统的本质不是写法问题,而是加载时机与绑定语义。你写的 import { foo } from './bar' 看似只是引入一个函数,背后决定着代码能否被摇掉、状态是否一致、调试时变量为何“不动”——选错模块规范,后期重构成本远高于初期多敲几行 export default