Опциональные свойства в интерфейсах TypeScript помечаются символом ? после имени свойства. Объект, реализующий такой интерфейс, может не содержать это свойство.
Синтаксис:
interface User {
name: string;
age?: number;
}
Свойство age необязательно — можно создать объект { name: "Alex" } без ошибки.
- Тип опционального свойства включает
undefined - При обращении нужно проверять наличие значения
- Опциональные свойства часто используются для конфигураций
В этом практическом тренажёре ты научишься правильно объявлять и использовать опциональные свойства в интерфейсах.
- Модуль 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. Сделай свойство опциональным
В этом задании вам нужно сделать указанные свойства интерфейса опциональными, добавив символ '?' после их названий. Интерфейс описывает профиль пользователя, но некоторые данные могут отсутствовать. Внесите изменения в код, чтобы он соответствовал требованиям опциональных свойств в TypeScript. Обратите внимание, что только два свойства должны стать опциональными, остальные остаются обязательными.
interface UserProfile {
name: string;
age: number;
email input1S string;
phone input2S string;
address: string;
}2. Найди ошибку в интерфейсе
В этом фрагменте TypeScript-кода допущена ошибка в объявлении интерфейса с опциональными свойствами. Ошибка связана с неправильным расположением знака вопроса, обозначающего опциональность свойства. Найдите и исправьте строку с ошибкой, чтобы интерфейс был объявлен корректно и объект мог быть создан без ошибок типизации.
interface UserProfile { username: string; email: string?; age?: number;} const currentUser: UserProfile = { username: "alex", age: 25};3. Выбери модификаторы свойств
В этом задании вам предстоит заполнить пропуски в интерфейсе TypeScript, выбрав правильные модификаторы свойств из выпадающего списка. Интерфейс описывает объект пользователя, где некоторые свойства обязательны, другие опциональны, а третьи гарантированно будут инициализированы позже. Внимательно читайте комментарии к каждому свойству, чтобы определить, какой модификатор (?, ! или отсутствие модификатора) следует использовать. Всего нужно заполнить 4 пропуска, используя 3 варианта из списка.
interface User {
id: number; // Обязательное свойство
usernameinput1S: string; // Обязательное свойство
emailinput2S: string; // Опциональное свойство (может отсутствовать)
isActiveinput3S: boolean; // Утверждение, что будет инициализировано позже
lastLogininput4S: Date; // Опциональное свойство (может быть undefined)
}4. Собери интерфейс
Из предложенных строк соберите корректный TypeScript-интерфейс с именем User, который включает обязательные свойства id (number), name (string), createdAt (Date) и опциональные свойства email (string) и age (number). Строки должны быть расположены в следующем порядке: сначала ключевое слово interface и имя, затем обязательные свойства, затем опциональные свойства, затем закрывающая фигурная скобка. Одна из строк является лишней и не должна входить в итоговый интерфейс.
interface User { id: number; name: string; createdAt: Date; email?: string; age?: number;} address: string;5. Пройдёт ли проверку?
Проанализируйте код на TypeScript, содержащий интерфейс с обязательными и опциональными свойствами, а также объект, который пытается соответствовать этому интерфейсу. Определите, пройдёт ли проверка типов TypeScript для данного объекта, и выберите правильное объяснение из предложенных вариантов.
interface UserProfile {
username: string;
email: string;
age?: number;
isVerified?: boolean;
}
const newUser: UserProfile = {
username: "alex123",
email: "alex@example.com",
age: 25,
isVerified: true,
country: "USA"
};6. Распредели свойства
Перед вами список свойств, объявленных в интерфейсе TypeScript. Ваша задача — распределить каждое свойство по одной из двух категорий: «Обязательные» или «Опциональные». Обратите внимание на синтаксис: опциональные свойства помечаются знаком вопроса (`?`) после имени. Всего нужно рассортировать 8 свойств. Перетащите каждый элемент в соответствующую категорию.
id: numbertitle?: stringcreatedAt: DateupdatedAt?: Datedescription: stringtags?: string[]isActive: booleanpriority?: number7. Отметь опциональные свойства
Внимательно изучите приведённый ниже интерфейс TypeScript. Ваша задача — найти и отметить кликом все опциональные свойства (те, которые помечены знаком вопроса ? после имени). Не отмечайте обязательные свойства, ключевые слова языка, фигурные скобки, точки с запятой или другие элементы кода. Обратите внимание, что опциональные свойства могут иметь различные типы данных.
interface {{UserSettings~|~t0}} {
{{userId~|~t1}}: {{number~|~t2}};
{{username~|~t3}}: {{string~|~t4}};
{{email?~|~t5}}: {{string~|~t6}};
{{age?~|~t7}}: {{number~|~t8}};
{{isActive~|~t9}}: {{boolean~|~t10}};
{{lastLogin?~|~t11}}: {{Date~|~t12}};
{{theme~|~t13}}: {{string~|~t14}};
}8. Какой тип у свойства?
Дан интерфейс TypeScript с опциональным свойством. Проанализируйте код и определите, какой тип TypeScript будет иметь это свойство при обращении к нему (с учётом того, что оно опциональное). Введите ответ в виде типа TypeScript, например, 'string | undefined' (порядок типов в объединении может быть обратным).
interface User {
name: string;
age?: number;
}
const user: User = { name: "Alice" };
const userAge = user.age; // какой тип у userAge?9. Порядок проверки свойства
Перед вами строки TypeScript-кода, демонстрирующие безопасное обращение к опциональному свойству объекта. Строки перемешаны. Расставьте их в правильном порядке, чтобы получился корректный фрагмент программы, который объявляет интерфейс с опциональным свойством, создаёт объект, проверяет наличие этого свойства, использует его значение при наличии и обрабатывает случай, когда свойство отсутствует (undefined).
if (person.phone !== undefined) { message = `Телефон: ${person.phone}`;console.log(message);} else { message = 'Телефон не указан'; }let message: string;interface Person { name: string; phone?: string; }const person: Person = { name: 'Bob' };