Heim >Web-Frontend >js-Tutorial >CommonJS (CJS) vs. ECMAScript-Module (ESM) in JavaScript
JavaScript-Module spielen eine entscheidende Rolle bei der Organisation von Code, der Verbesserung der Wiederverwendbarkeit und der Verbesserung der Wartbarkeit von Anwendungen. Zwei hauptsächlich verwendete Modulsysteme sind CommonJS (CJS) und ECMAScript-Module (ESM). Das Verständnis ihrer Unterschiede und Fähigkeiten ist der Schlüssel, um sie effektiv in Ihren Projekten einzusetzen.
CommonJS ist das Modulsystem, das ursprünglich für Node.js-Umgebungen entwickelt wurde. Es legt Wert auf Einfachheit und synchrones Laden von Modulen.
Module in CommonJS verwenden module.exports, um Werte, Objekte oder Funktionen zu exportieren.
1. Standardexport/-importe
// logger.js function log(message) { console.log(message); } module.exports = log; // Default export // index.js const log = require('./logger'); log('This is a log message.'); // Output: This is a log message.
2. Benannte Exporte/Importe
// math.js function add(a, b) { return a + b; } function subtract(a, b) { return a - b; } module.exports = { add, subtract }; // Named exports // index.js const { add, subtract } = require('./math'); console.log(add(5, 3)); // Output: 8 console.log(subtract(5, 3)); // Output: 2
ESM, eingeführt in ES6 (ES2015), ist das standardisierte Modulsystem für JavaScript. Es unterstützt sowohl das synchrone als auch das asynchrone Laden von Modulen und wird in modernen Browsern und in Node.js mit bestimmten Konfigurationen nativ unterstützt.
ESM verwendet Exportanweisungen, um Werte, Objekte oder Funktionen zu exportieren.
1. Standardexport/-import
// utils.mjs (Note the .mjs extension for ESM) function formatName(name) { return `Mr./Ms. ${name}`; } export default formatName; // index.mjs import formatName from './utils.mjs'; console.log(formatName('John')); // Output: Mr./Ms. John
2. Benannte Exporte
// operations.mjs export function multiply(a, b) { return a * b; } export function divide(a, b) { return a / b; } // index.mjs import { multiply, divide } from './operations.mjs'; console.log(multiply(4, 2)); // Output: 8 console.log(divide(10, 2)); // Output: 5
3. Gemischte Exportstile in ECMAScript-Modulen
// mixedExports.mjs function greet(name) { return `Hello, ${name}!`; } export default greet; export function goodbye(name) { return `Goodbye, ${name}!`; } // index.mjs import sayHello, { goodbye } from './mixedExports.mjs'; console.log(sayHello('Alice')); // Output: Hello, Alice! console.log(goodbye('Bob')); // Output: Goodbye, Bob!
Die Wahl zwischen CommonJS- und ECMAScript-Modulen hängt von der Umgebung und den Anforderungen Ihres Projekts ab. Während CommonJS robust für die Node.js-Backend-Entwicklung ist, bietet ESM Interoperabilität zwischen Browsern und modernen Node.js-Anwendungen. Das Verständnis dieser Modulsysteme versetzt Entwickler in die Lage, die modularen Funktionen von JavaScript effektiv zu nutzen.
Durch die Nutzung von CommonJS oder ESM können Entwickler die Codeorganisation verbessern, die Projektskalierbarkeit verbessern und die Zusammenarbeit in JavaScript-Projekten erleichtern.
Das obige ist der detaillierte Inhalt vonCommonJS (CJS) vs. ECMAScript-Module (ESM) in JavaScript. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!