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

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

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

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

Контент

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

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

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

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

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

## Що таке rest-параметри

> **Rest-параметри** дозволяють зібрати **залишкові аргументи** функції в один **масив**.

Синтаксис:

```javascript
function func(...args) {
  // args - це масив усіх переданих аргументів
}
```

---

## Приклад: сума всіх чисел

```javascript
function sum(...numbers) {
  return numbers.reduce((total, n) => total + n, 0);
}

console.log(sum(1, 2, 3, 4)); // 10
console.log(sum(5, 10));      // 15
```

Тут:

- `numbers` - це масив `[1, 2, 3, 4]` або `[5, 10]`
- Кількість аргументів не фіксована

---

## Rest-параметри йдуть **завжди останніми**

```javascript
function show(first, second, ...rest) {
  console.log(first); // перший аргумент
  console.log(second); // другий
  console.log(rest); // масив усіх інших
}

show("a", "b", "c", "d", "e");
// "a"
// "b"
// ["c", "d", "e"]
```

Після rest-параметра не можна вказувати інші параметри:

```javascript
function badExample(...args, last) {} // Помилка
```

---

## Відмінність від `arguments`

| Властивість | `arguments` | `...rest` |
|---|---|---|
| Тип | Псевдомасив | Справжній масив |
| Методи масиву (`map`, `reduce`) | Немає | Є |
| Працює у стрілкових функціях | Ні | Так |
| Ім'я задається явно | Ні | Так |
| Сучасний стандарт | Старий | ES6+ |

Приклад порівняння:

```javascript
function old() {
  console.log(arguments); // [Arguments] { '0': 1, '1': 2 }
}

const modern = (...args) => {
  console.log(args); // [1, 2]
};

old(1, 2);
modern(1, 2);
```

---

## Ще приклад - фільтрація аргументів

```javascript
function filterNumbers(min, ...numbers) {
  return numbers.filter(n => n > min);
}

console.log(filterNumbers(10, 5, 15, 8, 25));
// [15, 25]
```

Перший аргумент `min` використовується окремо,
а всі інші (`15, 8, 25`) потрапляють у масив `numbers`.

---

## Rest-параметри з деструктуризацією

```javascript
function logUser({ name, age, ...rest }) {
  console.log(name, age); // "Tim" 25
  console.log(rest); // { city: "Kyiv", active: true }
}

logUser({ name: "Tim", age: 25, city: "Kyiv", active: true });
```

Тут `...rest` збирає **всі інші властивості об'єкта**,
що не увійшли до явно вказаних (`name`, `age`).

---

## Комбінація зі spread-оператором

`...` виконує **дві різні ролі**:

- У параметрах функції -> **rest** (збирає аргументи в масив)
- У виклику функції -> **spread** (розкриває масив в аргументи)

```javascript
function sum(...nums) {
  return nums.reduce((a, b) => a + b, 0);
}

const values = [1, 2, 3];
console.log(sum(...values)); // 6
```

---

## Коротко запам'ятати

| Особливість | Опис |
|---|---|
| Синтаксис | `function fn(...args) {}` |
| Тип | Масив |
| Кількість аргументів | Довільна |
| Методи масиву | Працюють |
| Порядок | Rest-параметр завжди останній |
| Заміна `arguments` | Так |

---

## Проста аналогія

> `...rest` - це як "збирач аргументів":
> якщо ти передав багато значень, він акуратно складає **всі зайві** в масив.

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

Для рев’юера

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

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