Массивы объектов

В магазине много предметов. Массив объектов получает тип, как любой другой массив: Item[] — массив, каждый элемент которого — Item. Его стоит писать, ведь без него ошибка в одном из элементов может проскользнуть. Здесь у верёвки опечатка:

const shop = [
    { name: "Лечебное зелье", price: 25 },
    { name: "Верёвка", prize: 5 },
];

for (const item of shop) {
    console.log(item.price);
}

Программа выведет:

25
undefined

Ошибки нет! TypeScript определил тип массива по элементам как есть: у одного есть price, у другого — prize. Он не может знать, какое написание верное, поэтому пропускает item.price как значение, которое может быть undefined. С Item[] вы сообщаете, как должен выглядеть каждый элемент:

type Item = { name: string; price: number };

const shop: Item[] = [
    { name: "Лечебное зелье", price: 25 },
    { name: "Верёвка", prize: 5 },
    { name: "Лампа", price: "12" },
];

main.ts(5,24): error TS2561: Object literal may only specify known properties, but 'prize' does not exist in type 'Item'. Did you mean to write 'price'?
main.ts(6,22): error TS2322: Type 'string' is not assignable to type 'number'.

Каждая ошибка указывает на элемент с проблемой — своей строкой и столбцом.

В цикле for...of по Item[] каждый item — это Item, поэтому TypeScript знает, что item.price — число. Складывать цены можно спокойно, а опечатка вроде item.prices будет замечена: Property 'prices' does not exist on type 'Item'. Did you mean 'price'? push тоже проверяет новый элемент: shop.push({ name: "Карта" }) даёт Property 'price' is missing in type '{ name: string; }' but required in type 'Item'.

А массив, который сначала пуст и получает элементы позже, нуждается в типе, как вы знаете из урока 2: const cart: Item[] = [];.

Типичные ошибки:

• Забытые []. const shop: Item = [...] даёт Type '{ name: string; price: number; }[]' is missing the following properties from type 'Item': name, price. Иными словами: массив предметов — это не предмет.
• Массив вместо элемента в цикле. total += shop.price даёт Property 'price' does not exist on type 'Item[]'. У массива нет цены, она есть только у его элементов: item.price.