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

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

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

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

Контент

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

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

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

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

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

## Приклад: примітив + об'єкт в одному union

```javascript
type User = { name: string; age: number };

let value: string | User;

value = "Anonymous";         // рядок - підходить
value = { name: "Tim", age: 25 }; // об'єкт - теж підходить
value = 42;                  // Помилка - число не входить в union
```

> Тут `value` може бути **або рядком**, **або об'єктом з полями** `name` **і** `age`.

---

## Приклад: функція з union із примітивів і об'єктів

```javascript
type User = { id: number; name: string };

function printUser(user: string | User) {
  if (typeof user === "string") {
    console.log(`Ім'я користувача: ${user}`);
  } else {
    console.log(`ID: ${user.id}, Ім'я: ${user.name}`);
  }
}

printUser("Tim");                // рядок
printUser({ id: 1, name: "Tim" }); // об'єкт
```

> Ми використовуємо **type narrowing** (`typeof user === "string"`)
> - щоб звузити тип і безпечно звертатися до потрібних властивостей.

---

## Приклад: об'єднання кількох форм даних

```javascript
type Product = { name: string; price: number };
type ProductInput = string | number | Product;

> Тут `p` може бути рядком, числом **або об'єктом** -
> TypeScript гарантує, що ти перевіриш тип перед використанням.

---

## Приклад: об'єкт + `null` або `undefined`

Дуже частий випадок - **об'єкт може бути відсутнім**:

```javascript
type User = { id: number; name: string } | null;

let currentUser: User = null;           // OK
currentUser = { id: 1, name: "Tim" };   // OK
```

> Це дозволяє явно контролювати стан "немає даних".

---

## Важливо розуміти

Коли ти об'єднуєш примітиви і об'єкти, TypeScript:

- вимагає **перевірки типу** перед доступом до властивостей;
- дозволяє використовувати **спільні властивості**, якщо вони є у всіх варіантів.

Приклад:

```javascript
type A = { id: number };
type B = string;

function show(a: A | B) {
  // console.log(a.id); // не можна - string не має id
  if (typeof a !== "string") {
    console.log(a.id); // безпечно
  }
}
```

---

## Підсумок

| Чи можна об'єднувати? | Так |
|---|---|
| Примітиви + об'єкти | Можна |
| Скільки завгодно типів | Без обмежень |
| Перевірка перед використанням | Обов'язкова |
| Використовується для | Універсальних функцій, API-відповідей, гнучких структур |

---

### Коротко:

> Union-типи в TypeScript можна **змішувати вільно** -
> `string | number | { name: string } | null` - це цілком допустимо.
>
> Головне - **перевіряй тип перед зверненням до властивостей**.

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

Для рев’юера

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

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