Pick — один из базовых utility types в TypeScript, который позволяет создать новый тип, выбрав только нужные свойства из существующего. Это как взять большой объект и оставить от него только то, что реально понадобится.
Синтаксис: Pick, где T — исходный тип, а K — ключи, которые хотим оставить.
- Удобно для создания DTO Data Transfer Object — объект для передачи данных
- Помогает не дублировать описания типов
- Делает код более читаемым и поддерживаемым
Пример: Pick создаст тип только с полями id и name.
В этом интерактивном тренажере вы на практике разберётесь, как работает Pick и когда его применять.
- Модуль 1: Введение в TypeScript
- Модуль 2: Примитивные типы
- Модуль 3: Специальные типы
- Модуль 4: Массивы
- Модуль 5: Кортежи (Tuples)
- Модуль 6: Объекты
- Модуль 7: Функции
- Модуль 8: Union типы
- Модуль 9: Литеральные типы
- Модуль 10: Type Aliases
- Модуль 11: Интерфейсы
- Модуль 12: Type Guards и Narrowing
- Модуль 13: Enums
- Модуль 14: Классы
- Модуль 15: Generics — основы
- Модуль 16: Generics — ограничения
- Модуль 17: Utility Types — базовые
- Модуль 18: Utility Types — работа с Union
- Модуль 19: Utility Types — функции
- Модуль 20: Type Assertions
- Модуль 21: Keyof и Typeof операторы
- Модуль 22: Mapped Types
- Модуль 23: Conditional Types
- Модуль 24: Discriminated Unions
- Модуль 25: Модули и типы
- Модуль 26: Declaration Files
- Модуль 27: Типизация асинхронного кода
- Модуль 28: Практические паттерны
1. Базовый синтаксис Pick
В этом задании вам нужно использовать utility type Pick, чтобы создать новый тип, содержащий только определенные поля из существующего интерфейса. Дан интерфейс User с полями id, name, email, age. Заполните пропуски в коде, чтобы определить тип UserBasic, который включает только поля id и name.
interface User {
id: number;
name: string;
email: string;
age: number;
}
type UserBasic = input1S<User, input2S>;2. Исправить ошибку в Pick
В этом фрагменте кода TypeScript используется утилитный тип Pick для создания нового типа, который должен содержать только определённые поля из исходного интерфейса. Однако в коде допущена ошибка: указан несуществующий ключ (опечатка в названии поля). Найдите и исправьте эту опечатку, чтобы тип Pick корректно выбрал нужное свойство.
interface User { id: number; name: string; email: string;} type UserName = Pick<User, 'nam'>;3. Сопоставь Pick и результат
В левой колонке приведены различные выражения с использованием утилити-типа Pick на основе базового интерфейса User. В правой колонке — типы, которые получаются в результате этих выражений. Сопоставьте каждое выражение слева с соответствующим результирующим типом справа. Обратите внимание, что в правой колонке нет лишних вариантов, но порядок типов перемешан.
Pick<User, "id">Pick<User, "name" | "email">Pick<User, "age" | "isActive">Pick<User, "id" | "name" | "email">Pick<User, "isActive">{ name: string; email: string; }{ id: number; }{ isActive: boolean; }{ id: number; name: string; email: string; }{ age: number; isActive: boolean; }4. Выбери правильные ключи
В этом задании вам предстоит использовать утилиту Pick для создания нового типа на основе существующего интерфейса. Дан интерфейс User, содержащий различные поля пользователя. Вам нужно создать тип RegistrationForm, который будет содержать только те поля, которые необходимы для формы регистрации: имя, email и пароль. В коде ниже заполните пропуски, выбрав из выпадающего списка правильные ключи интерфейса User. Обратите внимание, что ключи должны быть строковыми литералами и соответствовать именам полей в интерфейсе.
interface User {
id: number;
name: string;
email: string;
password: string;
age: number;
address: string;
phone: string;
}
// Создайте тип для формы регистрации, используя Pick
type RegistrationForm = Pick<User, input1S | input2S | input3S>;5. Собери тип с Pick
Из предложенных строк соберите корректную TypeScript-программу, которая определяет интерфейс User, создаёт тип UserBasicInfo с помощью утилиты Pick, выбирая свойства 'id' и 'name', и объявляет функцию, использующую этот тип.
interface User { id: number; name: string; email: string;}type UserBasicInfo = Pick<User, 'id' | 'name'>;function displayUserInfo(user: UserBasicInfo) { console.log(`ID: ${user.id}, Name: ${user.name}`);}type UserWithoutEmail = Omit<User, 'email'>;6. Найди использование Pick
Внимательно изучите приведённый фрагмент кода на TypeScript. В нём используются различные Utility Types для создания новых типов на основе существующего типа `User`. Ваша задача — найти и выделить кликом только те строки, где применяется именно Utility Type `Pick`. Не отмечайте строки, где используются `Omit`, `Partial`, `Record` или другие конструкции.
7. Сколько свойств в типе
В данном задании рассматривается использование утилитарного типа Pick в TypeScript для создания новых типов путём выбора определённых свойств из существующего интерфейса. Изучите приведённый фрагмент кода, в котором определён интерфейс с шестью полями и применена цепочка преобразований с помощью Pick. Ваша задача — определить, сколько свойств останется в финальном типе после всех преобразований. Введите ответ в виде одного целого числа.
interface Person {
id: number;
name: string;
age: number;
email: string;
phone: string;
address: string;
}
type FirstPick = Pick<Person, 'id' | 'name' | 'age' | 'email'>;
type FinalType = Pick<FirstPick, 'id' | 'name' | 'age'>;
// Сколько свойств содержит тип FinalType?