Я изучаю TypeScript, и недавно я написал небольшое демонстрационное приложение React, которое обрабатывает данные обратной связи пользователей о избранных пастах.Приложение считывает данные JSON и фильтрует их, чтобы извлечь для каждого пользователя интересующие меня данные. В данном случае это имя пользователя, его пол и его любимые пасты, которые хранятся в объекте, ключи которогоназвания макарон (например, «спагетти») и значения которых являются числами.
Это интерфейсы, которые я придумал, которые работают
export interface PastaData {
[key: string]: number | undefined,
}
export interface UserData {
name: string,
gender:String,
favorites: PastaData
}
, и мои пользовательские данные, таким образом, будутмассив UserData
UserData[]
У меня вопрос, почему первый интерфейс для PastaData работает правильно.В моем случае пользовательский объект будет выглядеть примерно так:
{
name: 'Frank Frankson',
gender: 'male',
favorites: {
'spaghetti':99.242342,
'fusilli':42.5234234,
'linguine':84.523422,
'ravioli':92.234234
}
}
Почему тогда он работает, имея только один
[key: string]: number | undefined,
, когда существует несколькоэкземпляры этого типа в реальном объекте?Как тип TypeScript проверяет объект - читает ли он данные JSON во время «компиляции», а затем проверяет это по интерфейсу?Проверяет ли он только одну запись, то есть «спагетти», и видит, что она подходит, а затем игнорирует остальные?
А почему | undefined?Поскольку интерфейс каким-то образом считывает все возможные типы макаронных изделий, и когда некоторые из них не появляются в реальном объекте данных, он должен сказать, что для этих ключей типа макаронных изделий (те, которые не появляются в объекте) значение равно undefined?
Спасибо за любые идеи!Как я уже сказал, благодаря моим собственным исследованиям и с помощью переполнения стека все работает нормально, но я хочу улучшить свое понимание того, что происходит.