JavaScript & TypeScriptМодуль 7: Основы TypeScript
Объекты
Типизация объектов в TypeScript
Цель урока
В этом уроке ты научишься:
- Типизировать объекты
- Использовать опциональные свойства
- Работать с readonly
Inline типы
let user: { name: string; age: number } = {
name: "Иван",
age: 25
};Опциональные свойства
let user: {
name: string;
age: number;
email?: string; // опциональное
} = {
name: "Иван",
age: 25
// email не обязателен
};
// Проверка
if (user.email) {
console.log(user.email.toUpperCase());
}readonly
let user: {
readonly id: number;
name: string;
} = {
id: 1,
name: "Иван"
};
user.name = "Пётр"; // OK
// user.id = 2; // Ошибка!Index Signatures
Для объектов с динамическими ключами:
let scores: { [key: string]: number } = {
math: 90,
english: 85,
physics: 92
};
scores.chemistry = 88; // OK
// scores.biology = "отлично"; // Ошибка!Record
let scores: Record<string, number> = {
math: 90,
english: 85
};Вложенные объекты
let user: {
name: string;
address: {
city: string;
street: string;
zip?: string;
};
} = {
name: "Иван",
address: {
city: "Москва",
street: "Ленина"
}
};Тип object
// object — любой не-примитив
let obj: object = { a: 1 };
let arr: object = [1, 2, 3];
let fn: object = () => {};
// obj.a; // Ошибка! object не знает о свойствахНе путай
object — не-примитив. Object — конструктор. {} — пустой объект.
Практика
Задание 1: Типизация объекта
Задача: Создай типизированный объект продукта.
Запустите код для проверки
Loading...
Ваш вывод:
Ожидаемый результат:
Телефон 50000 true
Задание 2: Опциональные свойства
Задача: Создай объект с опциональным свойством.
Запустите код для проверки
Loading...
Ваш вывод:
Ожидаемый результат:
Иван undefined
Задание 3: Index Signature
Задача: Создай объект-словарь.
Запустите код для проверки
Loading...
Ваш вывод:
Ожидаемый результат:
привет мир
Проверь себя
- Как сделать свойство опциональным?
- Как запретить изменение свойства?
- Когда использовать Index Signature?