本文主要是介绍「Node.js」ESModule 与 CommonJS 的 区别，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！
前言
Node.js支持两种模块系统：CommonJS 和 ESModules（ESM），它们在语法和功能上有一些不同。
CommonJS (CJS)
CommonJS 是 Node.js 最早支持的模块规范，由于它的出现在ES6之前，因此采取的是同步加载模块的方式。这在服务端是可接受的，因为文件都在本地，同步加载不会引起明显的延迟问题。但是这样的加载方式不适合用在客户端，因为它会导致浏览器在等待模块下载和解析的期间挂起。
- CommonJS 通过
require函数来导入模块，如const module = require('module_name')。 - 模块导出使用
module.exports对象，如module.exports = value或exports.value = value。
ESModules (ESM)
ESModules 是ES6引入的官方标准化模块系统，支持静态导入和导出。静态模块结构允许JavaScript引擎优化加载和解析。
- 使用
import关键字导入模块，例如import { something } from 'module_name'。 - 使用
export关键字导出模块，例如export function doSomething() { ... }或export default class MyClass{ ... }。
ESModules设计为可以异步加载，这使其更适合于用在浏览器环境中，不过Node.js现在也支持ESModules。
区别
-
加载机制:
- CommonJS：同步加载。
- ESModules：可以异步加载，支持静态分析，预测性地进行代码的分割和按需加载。
-
模块解析:
- CommonJS 中，
require路径解析算法基于文件系统运作，并且可以省略文件后缀或指向文件夹。 - ESModules 使用更为严格的路径，通常需要文件后缀，遵循 URL 语法。
- CommonJS 中，
-
导出值:
- CommonJS 导出的是值的拷贝，也就是说，一旦
require()执行完毕，模块内部的变化不会影响这个值。 - ESModules 导出的是绑定的引用，模块外部能够实时观察到模块内部的变化。
- CommonJS 导出的是值的拷贝，也就是说，一旦
-
模块上下文:
- CommonJS 每个文件都是其模块的顶层作用域。
- ESModules 顶层
this是undefined，
应用场景
CommonJS 和 ESModules 由于它们各自的特点，在不同的应用场景下会有所偏好。下面列举了它们的典型应用场景：
CommonJS 的应用场景：
- Node.js服务端开发：由于服务端代码不需要考虑浏览器端的下载和延迟问题，CommonJS 的同步加载特性在服务端是完全可行的。同时，绝大多数Node.js的生态系统（npm上的包）都是基于CommonJS规范的。
- 旧项目维护：早期的Node.js项目都是基于CommonJS规范的，所以维护旧项目往往意味着继续使用CommonJS。
- 需要动态计算或条件加载模块的情况：由于CommonJS 支持运行时同步加载，你可以根据某些运行时计算的条件来要求模块。
ESModules 的应用场景：
- 现代化前端开发：如使用框架（例如React、Vue、Angular）和工具（如Webpack、Rollup、Parcel）构建项目。ESModules 支持动态导入（
import()）和静态代码分析，这有利于前端工具进行代码拆分，以懒加载的方式优化应用加载性能。 - 跨环境的代码共享：比如同时在Node.js和现代浏览器中运行的库或工具。ESModules是JavaScript官方的模块系统，现代浏览器原生支持。
- 新项目开发：创建新的Node.js项目时，倾向于使用ESModules，因为它是ECMAScript规范的一部分，并且Node.js及其生态系统正在向ESModules过渡。
- 需要利用静态分析来进行Tree-shaking优化的项目：Tree-shaking是一种只打包必要模块代码的方法，它依赖于ESModules的静态结构。
混合场景：
- 迁移的项目：如果你的项目计划从CommonJS迁移到ESModules，你可能会临时进入混合状态，这时要注意不同模块系统间的互操作。
- 使用第三方库：当需要在ESModules项目中使用仅提供CommonJS模块的第三方库时，也会出现混合使用。
Node.js已经提供了某些语法糖和特性来平滑CommonJS到ESModules的过渡，如import()动态导入语法来异步加载CommonJS模块等。
选择使用CommonJS还是ESModules很大程度上依赖于项目的目标环境、工具链支持、代码库的现状以及个人或团队的偏好。随着技术演进，社区正在向ESModules靠拢，但在稳定性、交付和兼容性要求很高的情况下，CommonJS仍然是一个合理而且可靠的选择。
使用示例
CommonJS
导出示例：
// myModule.js
const myFunction = () => {console.log('Hello, CommonJS!');
}
// 给exports对象添加属性
exports.myFunction = myFunction;
导入示例：
// app.js
const myModule = require('./myModule.js');
myModule.myFunction(); // 输出: 'Hello, CommonJS!'
ESModules
导出示例：
// myModule.js
export const myFunction = () => {console.log('Hello, ESModules!');
}
导入示例：
// app.js
import { myFunction } from './myModule.js';
myFunction(); // 输出: 'Hello, ESModules!'
此外，下面的示例说明了CommonJS如何在运行时加载模块，而ESModules则在编译时加载模块。
CommonJS 运行时加载
// 假设我们在运行代码之前并不知道我们需要加载的模块版本，我们可以在运行时动态地确定。
let version = 'v1';
if (someCondition) {version = 'v2';
}
const module = require(`./module${version}.js`);
ESModules 编译时加载
// 在ESModules中，不能这样动态加载模块，因为所有的import都会在编译时被处理。
// 下面的代码无法运行，会提示错误。
let version = 'v1';
if (someCondition) {version = 'v2';
}
// 报错
import module from `./module${version}.js`;
ESModules 动态加载
但是，ESModules 提供了一种动态导入的方法，可以在运行时异步加载模块：
let version = 'v1';
if (someCondition) {version = 'v2';
}
import(`./module${version}.js`) .then(module => {// 使用模块}).catch(err => {// 处理加载错误});
在这个例子中，import() 返回一个 Promise，加载完模块后会被解析，因此动态导入必须在 Promise 或 async/await 上下文中处理。
这篇关于「Node.js」ESModule 与 CommonJS 的 区别的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！
