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

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

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

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

Контент

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

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

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

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

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

**Коротко:**
**Композиція функцій (function composition)** - це спосіб **об'єднувати кілька функцій в одну**,
так що результат однієї функції стає **входом для наступної**.

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

> композиція - це коли ти **чіпляєш функції одна за одною**,
> щоб виконувати послідовні перетворення даних.

---

### Детальне пояснення

Якщо є функції `f` і `g`,
то їхня композиція `compose(f, g)` означає:

```javascript
compose(f, g)(x) === f(g(x))
```

Тобто спочатку виконується `g(x)`,
а потім результат передається у `f()`.

---

### Приклад 1 - вручну

```javascript
const toUpper = str => str.toUpperCase();
const exclaim = str => str + '!';

const shout = str => exclaim(toUpper(str));

console.log(shout('hello')); // "HELLO!"
```

Тут `shout` - це **композиція функцій** `toUpper` і `exclaim`.

---

### Приклад 2 - універсальна функція `compose`

```javascript
function compose(...fns) {
  return x => fns.reduceRight((v, fn) => fn(v), x);
}

const toUpper = str => str.toUpperCase();
const exclaim = str => str + '!';
const greet = str => `Hello, ${str}`;

const welcome = compose(exclaim, toUpper, greet);

console.log(welcome('bob')); // "HELLO, BOB!"
```

`compose` виконує функції справа наліво:
`compose(f3, f2, f1)(x)` → `f3(f2(f1(x)))`

---

### Приклад 3 - через `pipe` (зліва направо)

Для читабельності часто використовують протилежний порядок - **pipe**:

```javascript
const pipe = (...fns) => x => fns.reduce((v, fn) => fn(v), x);

const result = pipe(
  greet,
  toUpper,
  exclaim
)('bob');

console.log(result); // "HELLO, BOB!"
```

`pipe(f1, f2, f3)(x)` → `f3(f2(f1(x)))`,
але читається **зліва направо**, як природний потік даних.

---

### Навіщо потрібна композиція

Робить код **декларативним і читабельним**
Дозволяє **будувати складні перетворення** із простих функцій
Підвищує **перевикористовуваність** і **тестованість**
Це основа **функціонального програмування**

---

### Аналогія

Уяви конвеєр:

```javascript
вхід → функція A → функція B → функція C → результат
```

Композиція дозволяє зібрати цей конвеєр **в одну функцію**.

---

### ПІДСУМОК

| Властивість | Композиція функцій |
|---|---|
| Що робить | Об'єднує кілька функцій в один ланцюжок |
| Напрямок | Зазвичай справа наліво (`compose`) або зліва направо (`pipe`) |
| Формула | `compose(f, g)(x) = f(g(x))` |
| Переваги | Чистота, перевикористовуваність, читабельність |
| Приклад | `compose(toUpper, trim)(str)` |

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

Для рев’юера

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

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