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

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

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

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

Контент

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

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

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

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

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

## 1. Що робить `Required<T>`

> `Required<T>` - це вбудований Utility Type,
> який робить **усі властивості типу** `T` **обов'язковими** (тобто прибирає `?`).

---

### Приклад

```javascript
interface User {
  id: number;
  name?: string;
  email?: string;
}

type FullUser = Required<User>;
```

Тепер `FullUser` виглядає так:

```javascript
{
  id: number;
  name: string;   // більше не опціонально
  email: string;  // більше не опціонально
}
```

> Усі поля тепер **обов'язкові**, незалежно від того, чи були вони `?`.

---

## 2. Як `Required<T>` реалізований

Усередині TypeScript він визначений приблизно так:

```javascript
type Required<T> = {
  [P in keyof T]-?: T[P];
};
```

Пояснення:

- `keyof T` - прохід по всіх ключах типу `T`;
- `-?` - оператор, який **прибирає модифікатор** `?` (робить властивість обов'язковою);
- `T[P]` - зберігає оригінальний тип значення.

---

## 3. Чим `Required<T>` протилежний `Partial<T>`

| Утиліта | Що робить | Приклад результату |
|---|---|---|
| `Partial<T>` | Робить усі властивості **необов'язковими** | `{ id?: number; name?: string }` |
| `Required<T>` | Робить усі властивості **обов'язковими** | `{ id: number; name: string }` |

---

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

```javascript
interface Profile {
  username?: string;
  age?: number;
}

// Partial - послаблює вимоги:
type OptionalProfile = Partial<Profile>;
// { username?: string; age?: number }

// Required - посилює вимоги:
type StrictProfile = Required<Profile>;
// { username: string; age: number }
```

---

## 4. Як `Required<T>` впливає на опціональні властивості

Він **примусово прибирає знак** `?` з усіх властивостей інтерфейсу.
Навіть якщо властивість була опціональною, вона стає обов'язковою при використанні `Required`.

---

### Приклад

```javascript
interface Config {
  port?: number;
  host?: string;
}

type FullConfig = Required<Config>;

const cfg: FullConfig = {
  port: 8080,
  host: "localhost",
}; // усе повинно бути вказано
```

Якщо спробувати пропустити поле:

```javascript
const bad: FullConfig = { port: 8080 };
// Помилка: властивість "host" відсутня
```

---

## 5. Можна комбінувати `Partial` і `Required`

Іноді потрібно "повернути" обов'язковість лише частині полів:

```javascript
interface User {
  id: number;
  name?: string;
  email?: string;
}

// Усі поля необов'язкові
type OptionalUser = Partial<User>;

// Лише name знову обов'язкове
type PartiallyRequired = Required<Pick<User, "name">> & Partial<User>;
```

> Тепер `name` обов'язкове, а решта опціональні.

---

## 6. Приклад із практики

### Використання при валідації форми:

```javascript
interface FormData {
  name?: string;
  email?: string;
  age?: number;
}

function validate(data: Required<FormData>) {
  // усі поля гарантовано є
  console.log(data.name.toUpperCase());
}

validate({ name: "Tim", email: "tim@mail.com", age: 30 }); // OK
validate({ name: "Tim" }); // Помилка - email і age обов'язкові
```

---

## Підсумок

| Питання | Відповідь |
|---|---|
| Що робить `Required<T>` | Робить **усі властивості обов'язковими**, прибираючи `?` |
| Чим відрізняється від `Partial<T>` | Це **зворотний ефект** - `Partial` робить усе опціональним, `Required` робить усе обов'язковим |
| Як впливає на опціональні властивості | Перетворює їх на обов'язкові (`?` прибирається у всіх ключів) |

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

Для рев’юера

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

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