AMD 、 CommonJS 、 ES modules

CommonJS (CJS)

用途: 主要在 Node.js 環境中使用，早期沒有原生的 ES 模組支持時，CommonJS 是主要的模組規範。
語法:
require() 用來引入模組。
module.exports 或 exports 用來導出模組。
加載方式: 同步（Synchronous），在引入模組時會阻塞執行直到模組加載完成。
特點:
主要用於伺服器端，適合需要同步加載的情況。
不支持動態引入（import()），只能靜態引入。

AMD (Asynchronous Module Definition)

用途: 主要用於瀏覽器端的模組化，尤其是在非同步加載模組的情境下（例如瀏覽器中動態載入腳本）。
語法:
define() 用來定義模組，並可以指定模組的依賴。
依賴是非同步加載的，可以在加載後觸發回調函數。
加載方式: 非同步（Asynchronous），模組是非同步加載的，不會阻塞主執行緒。
特點:
允許模組之間具有依賴關係，並且非同步地解決依賴問題。
主要用途是在瀏覽器環境中動態加載模組。

ES Modules (ESM)

用途: ES6 引入的標準化模組系統，適用於瀏覽器端和伺服器端（Node.js 14+ 開始支持）。
語法:
import 用來引入模組。
export 用來導出模組。
加載方式:
靜態加載，模組的結構在編譯時就已經確定，這使得它可以進行靜態分析和優化。
支持動態引入，例如使用 import() 函數實現動態模組加載。
模組是按需加載的，可以利用瀏覽器的優化（如按需加載）。
特點:
提供了與語言本身緊密集成的模組機制，是未來 JavaScript 開發的趨勢。
支持靜態分析，有助於樹損（tree shaking）和代碼拆分。