Вложенные объекты в TypeScript — это объекты, которые содержат другие объекты в качестве своих свойств. Это базовый способ организации сложных структур данных.
При типизации вложенных объектов нужно описать структуру на каждом уровне:
const user: { name: string; address: { city: string; zip: number } } = { ... };
Обращение к вложенным свойствам происходит через цепочку точек: user.address.city. TypeScript проверяет корректность обращения на каждом уровне вложенности.
- Можно использовать отдельные типы или интерфейсы для вложенных объектов
- Глубина вложенности не ограничена, но влияет на читаемость
В этом интерактивном тренажёре ты потренируешься создавать и типизировать вложенные объекты на практических примерах.
- Модуль 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. Типизация вложенного объекта
Проанализируйте приведенный код. В нем объявлен тип UserProfile, который содержит вложенный объект location. Ниже создается переменная userData этого типа, где вложенным свойствам присваиваются конкретные значения. Заполните пропуски в определении типа, указав корректные примитивные типы данных (string или number), соответствующие значениям в переменной.
type UserProfile = {
name: string;
location: {
city: input1S;
postalCode: input2S;
}
};
const userData: UserProfile = {
name: "Marina",
location: {
city: "Minsk",
postalCode: 220000
}
};2. Ошибка в обращении к свойству
В приведённом фрагменте кода TypeScript определён объект пользователя с вложенным объектом адреса. При выводе в консоль допущена опечатка в имени свойства. Найдите и исправьте ошибку, чтобы в консоль вывелось название города.
const user = { name: "John", age: 30, address: { city: "New York", street: "Broadway" }};console.log(user.address.citi);3. Собери вложенный объект
Из предложенных строк соберите корректное объявление типа для вложенного объекта на TypeScript. Тип для объекта `person` должен содержать свойства `name` (строка), `age` (число) и вложенный объект `address` с полями `city` и `street` (оба строки). Игнорируйте лишние строки, не относящиеся к объявлению этого типа.
const person: { name: string; age: number; address: { city: string; street: string; } }; phone: string;4. Что вернёт обращение?
Проанализируйте код на TypeScript, содержащий объект с двумя уровнями вложенности. Обратите внимание на структуру объекта и путь к свойству, указанный в console.log. Выберите результат, который будет выведен в консоль.
const company = {
name: 'TechCorp',
address: {
city: 'Moscow',
street: 'Lenina',
building: {
number: 10,
entrance: 2
}
},
employees: 150
};
console.log(company.address.building.entrance);5. Напиши значение свойства
В приведённом фрагменте кода TypeScript определён объект library, содержащий вложенные объекты и массивы. Проанализируйте структуру объекта и определите, какое значение будет получено при обращении к свойству library.sections.fiction.books[1].author. Введите это значение в поле ответа в виде одной строки без кавычек.
let library = {
name: "City Library",
sections: {
fiction: {
books: [
{ title: "The Great Gatsby", author: "F. Scott Fitzgerald", year: 1925 },
{ title: "To Kill a Mockingbird", author: "Harper Lee", year: 1960 }
],
librarian: "John Doe"
},
nonFiction: {
books: [
{ title: "Sapiens", author: "Yuval Noah Harari", year: 2011 }
],
librarian: "Jane Smith"
}
}
};
// Чему равно значение library.sections.fiction.books[1].author ?6. Найди вложенные объекты
Внимательно изучите код на TypeScript. В нём объявлен объект user с различными свойствами. Ваша задача — отметить только те свойства, значениями которых являются объекты (вложенные объекты). Не отмечайте свойства с примитивными значениями (строка, число, булево) и массивами.
const user = {
{{name~|~t1}}: "Alice",
{{age~|~t2}}: 30,
{{isActive~|~t3}}: true,
{{hobbies~|~t4}}: ["reading", "coding"],
{{address~|~t5}}: {
street: "123 Main St",
city: "Wonderland"
},
{{education~|~t6}}: {
degree: "Bachelor",
year: 2015
},
{{work~|~t7}}: {
company: "Tech Corp",
position: "Developer"
},
{{scores~|~t8}}: [95, 87, 92]
};7. Выбери типы для структуры
В данном коде объявлен тип для вложенного объекта, описывающего книгу. Необходимо выбрать подходящие типы для каждого свойства из предложенных вариантов, чтобы получить корректную структуру данных. Обратите внимание на различия между простыми типами, объектами и массивами.
type Book = {
title: input1S;
year: input2S;
author: input3S;
};8. Разметь части объявления
Разметьте объявление вложенного объекта в TypeScript. Укажите для каждого выделенного фрагмента, является ли он именем переменной, типом внешнего объекта, именем вложенного свойства, типом вложенного объекта или значением переменной. Обратите внимание, что типы могут быть заданы через псевдонимы (type alias), а значение — это литерал объекта, присваиваемый переменной.
type Inner = { b: number };
type Outer = { {{a~|~t3}}: {{Inner~|~t4}} };
const {{o~|~t1}}: {{Outer~|~t2}} = {{ { a: { b: 1 } }~|~t5 }};