Is the Typescript interface correct for this object?

Question

I would like to create a Typescript Interface for objects like these:

{
  "id": 34728,
  "url": "https://example.com/image.jpg",
  "commonNames": {
    "de": ["Apfel", "Kulturapfel"],
    "en": ["apple"],
    "th": ["แอปเปิล"]
  },
}

Is my approach correct? I'm especially unsure about the commonNames.

interface Food {
  id: number;
  url: string;
  commonNames: {
    [index: string]: string[];
  };
}

Is there a predefined list of commonName keys ('de', 'en', 'th'), or could it be literally any string and you won't know which ones until runtime? If it's any string, then you've done it correctly. — Nicholas Tower
– Nicholas Tower, Commented May 9, 2020 at 5:01
Yes thanks, it could be any string. How would it look like if I later decided to add a predefined list of CommonName keys? — Tom
– Tom, Commented May 9, 2020 at 5:06
There's a couple options, but i'd probably define a union type with the various strings, then use that. eg: type Language = 'de' | 'en' | 'th' and commonNames: { [index in Language]: string[] } — Nicholas Tower
– Nicholas Tower, Commented May 9, 2020 at 5:15

Jörg W Mittag · Accepted Answer · 2021-09-13 08:51:17Z

As already confirmed in @Nicholas Tower's comment, your approach is correct.

There is, however, a small improvement I would like to suggest: you have three strings in your type definition. However, those three strings actually mean completely different things. So, what I would do, is give them a type alias:

type Uri      = string;
type Language = string;
type Name     = string;

interface Food {
  id: number;
  url: Uri;
  commonNames: {
    [index: Language]: Name[];
  };
}

These are only aliases, so they do not actually change anything about the typing. But, they make it a little bit clearer what those attributes are about.

Also, a type alias gives you a place that you can attach a TSDoc comment to:

/**
/ * A globally unique, monotonically increasing identifier for a dictionary entry
**/
type Id         = number;

/**
/ * A URI
**/
type Uri        = string;

/**
/ * A URI referencing a picture of the food
**/
type PictureUri = Uri;

/**
/ * An ISO 639-1:2002 Alpha-2 Language Code
**/
type Language   = string;

/**
/ * The name of the food
**/
type Name       = string;

interface Food {
  id: Id;
  url: PictureUri;
  commonNames: {
    [index: Language]: Name[];
  };
}

This is of course an extreme example, but it shows the value of type aliases for documentation.

Collectives™ on Stack Overflow

Is the Typescript interface correct for this object?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related