ES modules ve CommonJS arasındaki fark nedir?

Question

Accepted Answer

Bunlar, kodu dosyalara ayırmak için JavaScript'in iki modül sistemidir.

## ES Modules (ESM) — modern standart

```js
// import / export, used in browsers and modern Node
import { sum } from "./math.js";
import defaultThing from "./thing.js";
export const x = 1;
export default function () {};
```

## CommonJS (CJS) — Node'un eski sistemi

```js
const { sum } = require("./math");
module.exports = { x: 1 };
```

## Temel farklar

| | ES Modules | CommonJS |
|---|---|---|
| Syntax | `import`/`export` | `require`/`module.exports` |
| Loading | static, async | dynamic, synchronous |
| Analyzable | ✅ → tree-shaking | ❌ harder |
| Bindings | live (read-only) | kopyalanan bir değer |
| `this` at top | `undefined` | `module.exports` |

**Static**, ESM import'ları parse zamanında bilinir anlamına gelir, bu da bundler'ların **tree-shaking** (kullanılmayan export'ları bırakmak) yapmasını sağlar. CommonJS `require` dinamiktir (koşullu olarak `require` yapabilirsiniz), bu nedenle kolayca analiz edilemez.

## Node'da ESM'yi etkinleştirme

```json
{ "type": "module" } // in package.json, or use the .mjs extension
```

## Interop sorunu

CommonJS'den ESM'ye özgü bir paketi `require()` yapamazsınız; ikisini karıştırmak zorluklar yaratır. ESM import'ları da **live bindings**'dir — dışa aktarıcı değeri değiştirirse, içe aktaranlar yeni değeri görür (CJS size bir snapshot kopyası verir).

## Neden önemli

ESM gelecektir (tarayıcı-yerel, tree-shakeable, top-level `await`).

Yeni kod için bunu tercih edin; CJS'yi anlayın çünkü Node ekosisteminin büyük bir kısmı hala bunu kullanıyor.

	ES Modules	CommonJS
Syntax	`import`/`export`	`require`/`module.exports`
Loading	static, async	dynamic, synchronous
Analyzable	✅ → tree-shaking	❌ harder
Bindings	live (read-only)	kopyalanan bir değer
`this` at top	`undefined`	`module.exports`