I have an array of object like this:
[
{
"bio": "Douglas Gerald Hurley is an American engineer, former Marine Corps pilot and former NASA astronaut. He launched into space for the third time as commander of Crew Dragon Demo-2.",
"images": {
"png": "./assets/crew/image-douglas-hurley.png",
"webp": "./assets/crew/image-douglas-hurley.webp"
},
"name": "Douglas Hurley",
"role": "Commander"
},
{
"bio": "Mark Richard Shuttleworth is the founder and CEO of Canonical, the company behind the Linux-based Ubuntu operating system. Shuttleworth became the first South African to travel to space as a space tourist.",
"images": {
"png": "./assets/crew/image-mark-shuttleworth.png",
"webp": "./assets/crew/image-mark-shuttleworth.webp"
},
"name": "Mark Shuttleworth",
"role": "Mission Specialist"
},
{
"bio": "Pilot on the first operational flight of the SpaceX Crew Dragon to the International Space Station. Glover is a commander in the U.S. Navy where he pilots an F/A-18.He was a crew member of Expedition 64, and served as a station systems flight engineer.",
"images": {
"png": "./assets/crew/image-victor-glover.png",
"webp": "./assets/crew/image-victor-glover.webp"
},
"name": "Victor Glover",
"role": "Pilot"
},
{
"bio": "Anousheh Ansari is an Iranian American engineer and co-founder of Prodea Systems. Ansari was the fourth self-funded space tourist, the first self-funded woman to fly to the ISS, and the first Iranian in space.",
"images": {
"png": "./assets/crew/image-anousheh-ansari.png",
"webp": "./assets/crew/image-anousheh-ansari.webp"
},
"name": "Anousheh Ansari",
"role": "Flight Engineer"
}
]
I typed that with index signature:
export type PlanetInfo = {
[key: string]: string;
}[];
but of course there are also the key "images" that are objects, I resolve that behaviour with:
export type PlanetInfo = {
[key: string]: any;
}[];
but I don't think the use of 'any' is correct. Is there a better way?
Objectively answering your question, this is my go:
//if these are optional mark them so with `?` also if there are more formats you support you could add them here as well
type Image = {
png: string,
webp: string,
}
export type PlanetInfo = {
[key: string]: string | Image;
}[];
However I feel that your type is less "free" than what we just defined. What about :
type PlanetInfo = {
bio: string,
images: Image //same type as above,
name: string,
role: string, //maybe this one is an enum (can have only a set of values, check the api documentation of wherever you're getting this value
}[]