Запропонувати правку

Покращити цю статтю

Допрацюйте відповідь до «Що означає термін «CommonJS»?». Ваші зміни проходять модерацію перед публікацією.

Потрібне підтвердження

Контент

Що ви змінюєте

Заголовок (UA)

Коротка відповідь (UA)

Показується над повною відповіддю для швидкого нагадування.

Відповідь (UA)

## 1. Що таке CommonJS

> **CommonJS (CJS)** - це **стандарт (специфікація)** для організації коду у вигляді модулів у JavaScript, призначений **для виконання поза браузером** (на сервері).

Простіше кажучи:

> CommonJS - це **правила, як JavaScript-код повинен експортувати й імпортувати значення між файлами**, щоб модулі могли працювати в серверному середовищі (наприклад, у Node.js).

## 2. Навіщо з'явився CommonJS

На початку 2000-х JavaScript існував лише в браузері, і в ньому **не було вбудованої модульної системи** - усе писали в одному файлі, і змінні легко конфліктували.

Коли JavaScript почали використовувати **поза браузером** (наприклад, на сервері), знадобився **універсальний стандарт**, який дозволив би:

- ділити код на файли (модулі);
- імпортувати/експортувати функції й об'єкти;
- керувати залежностями.

Так у 2009 році група розробників запропонувала стандарт **CommonJS** (тоді під назвою "ServerJS").

## 3. Основна ідея CommonJS

Кожен файл - це **ізольований модуль**.
Він може:

- **експортувати** значення назовні (`module.exports`);
- **імпортувати** інші модулі (`require()`).

### Приклад CommonJS:

```javascript
// math.js
const PI = 3.14;
function add(a, b) {
  return a + b;
}

module.exports = { PI, add };
```

```javascript
// app.js
const math = require('./math');
console.log(math.add(2, 3)); // 5
```

Ключові елементи CommonJS:

- `require()` - функція для **імпорту**;
- `module.exports` / `exports` - об'єкт для **експорту**;
- кожен модуль виконується **один раз**, а потім **кешується**.

## 4. CommonJS - це не тільки Node.js

Хоча CommonJS асоціюється саме з Node.js, спочатку це була **відкрита ініціатива**.
Node.js просто став **першим і найуспішнішим** втіленням стандарту.

Інші платформи, що підтримують CommonJS:

- **Narwhal**
- **RingoJS**
- **MongoDB shell (ранні версії)**
- **Electron (main process)**

## 5. CommonJS у Node.js

Node.js реалізує CommonJS майже повністю (із деякими особливостями):

- кожен `.js` файл = модуль;
- модулі **ізольовані** один від одного;
- під час завантаження Node.js обгортає їх у внутрішню функцію:

```javascript
  (function (exports, require, module, __filename, __dirname) {
    // код модуля
  });
  ```

Це забезпечує:

- приватну область видимості;
- доступ до `__dirname`, `__filename`;
- можливість використовувати `require()` усередині будь-якого файлу.

## 6. Як працює завантаження CommonJS-модулів

1. **Розв'язання шляху:** Node шукає файл (`.js`, `.json`, `.node`).
2. **Читання файлу:** зчитується вміст.
3. **Обгортання:** код кладеться у функцію (щоб створити область видимості).
4. **Виконання:** виконується, результат зберігається в `module.exports`.
5. **Кешування:** при наступному `require()` модуль береться з пам'яті.

Це робить модулі швидкими й перевикористовуваними.

## 7. CommonJS vs ES Modules (ESM)

| Критерій | CommonJS (CJS) | ES Modules (ESM) |
|---|---|---|
| Імпорт | `require()` | `import` |
| Експорт | `module.exports` | `export` |
| Завантаження | Синхронне | Асинхронне |
| Тип даних | Копія значення | Жива посилання |
| Підтримка | Node.js (за замовчуванням) | Сучасний JS-стандарт |
| Розширення | `.js` | `.mjs` чи `"type": "module"` |
| Tree-shaking | Немає | Є |
| Сумісність | Старі пакети | Новий стандарт ES6+ |

CommonJS чудово підходить для серверного JS,
а ESM - для браузерів і сучасних Node.js-проєктів.

## 8. Приклад відмінностей у коді

### CommonJS:

```javascript
const fs = require('fs');
module.exports = { readFile: fs.readFile };
```

### ES Modules:

```javascript
import fs from 'fs';
export const readFile = fs.readFile;
```

## 9. Чому CommonJS синхронний

CommonJS був спроєктований для **серверного середовища**, де:

- файли розташовані **на локальному диску**;
- синхронне читання модулів не спричиняє проблем із продуктивністю.

Тому:

```javascript
const math = require('./math');
```

→ виконується **під час запуску**, не чекаючи асинхронних операцій.

А от у браузері це б "підвісило" сторінку,
тому в ESM завантаження модулів - **асинхронне**.

## 10. Коротко: основні об'єкти CommonJS

| Об'єкт | Призначення |
|---|---|
| `require()` | Імпортує модуль |
| `module.exports` | Об'єкт, що експортується з модуля |
| `exports` | Спрощене посилання на `module.exports` |
| `__dirname` | Шлях до папки поточного модуля |
| `__filename` | Шлях до поточного файлу |
| `module` | Інформація про поточний модуль |

## 11. Приклад - усе разом

```javascript
// logger.js
console.log('Модуль завантажено:', __filename);

module.exports.log = (msg) => {
  console.log(`[LOG]: ${msg}`);
};

// app.js
const logger = require('./logger');
logger.log('Привіт, CommonJS!');
```

Вивід:

```javascript
Модуль завантажено: /path/logger.js
[LOG]: Привіт, CommonJS!
```

## Одним реченням

> **CommonJS** - це стандарт модульної системи JavaScript, у якому код організовано в окремі файли, він експортується через `module.exports` і імпортується за допомогою `require()`.
> Саме CommonJS лежить в основі модульної архітектури Node.js.

Markdown · перетягуйте зображення · ⌘B / ⌘I шорткати702 слів

Для рев’юера

Примітка для модератора (необов’язково)

Бачить лише модератор. Прискорює рев’ю.