Запропонувати правкуПокращити цю статтюДопрацюйте відповідь до «Що робить Pick<T, K>?». Ваші зміни проходять модерацію перед публікацією.Потрібне підтвердженняКонтентЩо ви змінюєте🇺🇸EN🇺🇦UAПереглядЗаголовок (UA)Коротка відповідь (UA)**`Pick<T, K>`** створює новий тип, що містить лише вказані поля `K` з вихідного типу `T`. **Ключове:** `K` повинно бути підмножиною ключів `T` (`K extends keyof T`), інакше TypeScript одразу видасть помилку компіляції.Показується над повною відповіддю для швидкого нагадування.Відповідь (UA)Зображення## 1. Що робить `Pick<T, K>` > `Pick<T, K>` - створює **новий тип**, > що містить **лише вказані поля** `K` з вихідного типу `T`. --- ### Синтаксис ```javascript Pick<SourceType, 'key1' | 'key2' | ...> ``` --- ### Приклад ```javascript interface User { id: number; name: string; email: string; age: number; } // створюємо тип лише з id і name type UserPreview = Pick<User, 'id' | 'name'>; ``` Тепер `UserPreview` еквівалентний: ```javascript { id: number; name: string; } ``` > Інші поля (`email`, `age`) виключені. --- ## 2. Як вибрати лише потрібні поля з інтерфейсу Просто передай імена потрібних властивостей другим аргументом (`K`): ```javascript type UserShort = Pick<User, 'name' | 'email'>; const u: UserShort = { name: "Tim", email: "tim@example.com", }; ``` > Можна вибрати одну або декілька властивостей, об'єднуючи їх через `|`. --- ## 3. Як `Pick` працює всередині Вбудована реалізація виглядає так: ```javascript type Pick<T, K extends keyof T> = { [P in K]: T[P]; }; ``` Розшифровка: - `K extends keyof T` - обмежує список ключів лише наявними в `T`; - `[P in K]` - створює новий об'єкт, що складається з обраних ключів; - `T[P]` - зберігає оригінальні типи властивостей. --- ## 4. Що станеться, якщо вказати неіснуюче поле TypeScript **одразу видасть помилку компіляції**, тому що `K` повинно бути підмножиною ключів з `T`. --- ### Приклад помилки ```javascript type Wrong = Pick<User, 'id' | 'nickname'>; // Помилка: Type '"nickname"' is not assignable to keyof 'User' ``` > TypeScript суворо перевіряє, що `'nickname'` немає в `User`. --- ## 5. Застосування в реальних проєктах ### Приклад 1. DTO або відповідь API ```javascript interface User { id: number; name: string; email: string; password: string; } // безпечний тип без пароля type PublicUser = Pick<User, 'id' | 'name' | 'email'>; ``` > Використовується, щоб **обмежити набір властивостей** перед поверненням даних. --- ### Приклад 2. Preview-об'єкти ```javascript interface Product { id: number; title: string; description: string; price: number; } type ProductCard = Pick<Product, 'id' | 'title' | 'price'>; ``` > Для картки товару не потрібні всі поля - > лише базова інформація. --- ### Приклад 3. Комбінування з іншими Utility Types ```javascript type OptionalName = Partial<Pick<User, 'name'>>; ``` > Спочатку вибираємо потрібне поле (`Pick`), > потім робимо його необов'язковим (`Partial`). --- ## 6. Ключова відмінність від `Omit<T, K>` | Утиліта | Що робить | Приклад | |---|---|---| | `Pick<T, K>` | **Залишає** вказані поля | `Pick<User, 'id' | | `Omit<T, K>` | **Виключає** вказані поля | `Omit<User, 'password'>` | --- ## Підсумок | Питання | Відповідь | |---|---| | Що робить `Pick<T, K>` | Створює новий тип, що включає лише обрані властивості з `T` | | Як вибрати потрібні поля | Вказати їх другим параметром (`'field1' | | Що буде при неіснуючому полі | TypeScript видасть помилку компіляції (`"X" is not assignable to keyof T`) |Для рев’юераПримітка для модератора (необов’язково)Бачить лише модератор. Прискорює рев’ю.