Объекты в TypeScript

Объекты в TypeScript ведут себя особым образом. При объявлении объектов тип данных не указывается. Для примера сделаем объект с юзером, хранящий в себе его имя и возраст:

let user = {name: 'john', age: 30};

TypeScript сам понимает, что в переменной содержится объект и сам контролирует структуру этого объекта, предохраняя его от непредусмотренных изменений. Давайте разбираться подробнее.

Контроль типа переменной

TypeScript контролирует тип переменной с объектом, запрещая записывать в нее данные другого типа. Посмотрим на примере. Пусть у нас дан объект с юзером:

let user = {name: 'john', age: 30};

Попробуем записать в эту переменную данные другого типа, например, строку. Мы получим ошибку:

user = 'eric'; // ошибка

Контроль структуры объекта

TypeScript также контролирует структуру объекта. Пусть мы объявили наш объект с юзером:

let user = {name: 'john', age: 30};

В момент объявления TypeScript запоминает, что в нашем объекте есть ключи name и age, а затем контролирует, чтобы в переменной хранился объект именно с этими ключами.

Попытка записать в переменную другой объект приводит к ошибке компиляции. Давайте попробуем. Запишем в переменную объект, в котором не хватает ключа:

user = {name: 'eric'}; // ошибка

Запишем в переменную объект, в котором лишний ключ:

user = {name: 'eric', age: 40, salary: 300}; // ошибка

А теперь запишем в переменную объект, содержащий только ключи name и age:

user = {name: 'eric', age: 40}; // работает

Контроль типов значений

В момент объявления объекта TypeScript запоминает тип данных всех его элементов, а затем контролирует, чтобы эти типы не изменялись.

Посмотрим на примере нашего объекта с юзером. Объявим его:

let user = {name: 'john', age: 30};

После объявления TypeScript проанализировал тип данных каждого значения и запомнил, что в поле name - строка, а в поле age - число.

Теперь попытка записать в поле значение другого типа закончится ошибкой.

Пример:

user.name = 123; // ошибка

Пример:

user.age = 'eee'; // ошибка

Пример:

user.age = '30'; // ошибка

Практические задачи

Не запуская код определите каким будет результат выполнения кода:

let date = {year: 2025, month: 12, day: 31};
date.isLeap = true;

console.log(date);

Не запуская код определите каким будет результат выполнения кода:

let date = {year: 2025, month: 12, day: 31};
date = {year: 2025, month: 12};

Не запуская код определите каким будет результат выполнения кода:

let date = {year: 2025, month: 12, day: 31};
date = {year: 2025, month: 12, date: 7};