Node的CJS与ESM有哪些不同点

在Node.js中，模块系统主要有两种：CommonJS（CJS）和ECMAScript Modules（ESM）。这两种模块系统在语法、加载方式、兼容性等方面存在显著差异。本文将详细探讨CJS与ESM的不同点。

1. 语法差异

CommonJS (CJS)

CommonJS是Node.js最早采用的模块系统，使用require和module.exports来导入和导出模块。

// 导出模块
module.exports = {
  foo: 'bar'
};

// 导入模块
const myModule = require('./myModule');
console.log(myModule.foo); // 输出: bar

ECMAScript Modules (ESM)

ESM是JavaScript的标准模块系统，使用import和export来导入和导出模块。

// 导出模块
export const foo = 'bar';

// 导入模块
import { foo } from './myModule.js';
console.log(foo); // 输出: bar

2. 加载方式

CommonJS (CJS)

CJS是同步加载模块的，这意味着模块在require时会被立即加载和执行。

const fs = require('fs');
const data = fs.readFileSync('./file.txt', 'utf8');
console.log(data);

ECMAScript Modules (ESM)

ESM是异步加载模块的，这意味着模块在import时会被异步加载和执行。

import { readFile } from 'fs/promises';

async function readData() {
  const data = await readFile('./file.txt', 'utf8');
  console.log(data);
}

readData();

3. 文件扩展名

CommonJS (CJS)

CJS模块通常使用.js作为文件扩展名。

// myModule.js
module.exports = {
  foo: 'bar'
};

ECMAScript Modules (ESM)

ESM模块通常使用.mjs作为文件扩展名，或者在package.json中指定"type": "module"。

// myModule.mjs
export const foo = 'bar';

或者在package.json中指定：

{
  "type": "module"
}

4. 兼容性

CommonJS (CJS)

CJS是Node.js的默认模块系统，因此在所有版本的Node.js中都得到支持。

ECMAScript Modules (ESM)

ESM在Node.js 12及以上版本中得到支持，但在某些情况下可能需要额外的配置或使用.mjs扩展名。

5. 动态导入

CommonJS (CJS)

CJS支持动态导入，可以通过require在运行时动态加载模块。

const moduleName = './myModule';
const myModule = require(moduleName);
console.log(myModule.foo);

ECMAScript Modules (ESM)

ESM也支持动态导入，但需要使用import()函数。

const moduleName = './myModule.js';
import(moduleName).then(myModule => {
  console.log(myModule.foo);
});

6. 顶层await

CommonJS (CJS)

CJS不支持顶层await，必须在异步函数中使用await。

async function main() {
  const data = await someAsyncFunction();
  console.log(data);
}

main();

ECMAScript Modules (ESM)

ESM支持顶层await，可以在模块的顶层直接使用await。

const data = await someAsyncFunction();
console.log(data);

7. 模块解析

CommonJS (CJS)

CJS模块解析是基于文件路径的，require会按照Node.js的模块解析规则查找模块。

const myModule = require('./myModule');

ECMAScript Modules (ESM)

ESM模块解析是基于URL的，import会按照ESM的模块解析规则查找模块。

import { foo } from './myModule.js';

8. 默认导出

CommonJS (CJS)

CJS支持默认导出，可以通过module.exports导出单个值。

module.exports = 'bar';

ECMAScript Modules (ESM)

ESM也支持默认导出，可以通过export default导出单个值。

export default 'bar';

9. 循环依赖

CommonJS (CJS)

CJS在处理循环依赖时可能会导致部分模块未完全加载。

// a.js
const b = require('./b');
console.log('a:', b);

// b.js
const a = require('./a');
console.log('b:', a);

ECMAScript Modules (ESM)

ESM在处理循环依赖时更加健壮，能够正确处理未完全加载的模块。

// a.mjs
import { b } from './b.mjs';
console.log('a:', b);

// b.mjs
import { a } from './a.mjs';
console.log('b:', a);

10. 性能

CommonJS (CJS)

CJS是同步加载的，因此在加载大量模块时可能会导致性能问题。

ECMAScript Modules (ESM)

ESM是异步加载的，因此在加载大量模块时性能更好。

结论

CJS和ESM在Node.js中各有优缺点。CJS是Node.js的传统模块系统，兼容性好，但同步加载可能导致性能问题。ESM是JavaScript的标准模块系统，支持异步加载和顶层await，但在某些情况下需要额外的配置。根据项目需求选择合适的模块系统是非常重要的。