How to understand syntax in TypeScript interface [key: string]

Question

I'm having trouble deciphering a TypeScript syntax I found within an interface declaration here.

interface FormattingOptions {
    tabSize: number;
    insertSpaces: boolean;
    [key: string]: boolean | number | string;
}

Can someone explain me the third parameter of this interface? The one containing [key: string] ...? How is this type of syntax called?

Possible duplicate of Typescript: bracket notation property access — Erik Philips
– Erik Philips, Commented Jun 1, 2018 at 20:09
Possible duplicate of What do square brackets mean where a field should be in typescript? — Bergi
– Bergi, Commented Jun 30, 2024 at 18:54

Xiangming Hu · Accepted Answer · 2022-08-31 15:37:02Z

28

It's an index signature. It means that besides the known properties of the interface, any other properties of type boolean, number or string can be present

interface FormattingOptions {
    tabSize: number;
    insertSpaces: boolean;
    [key: string]: boolean | number | string;
}

let f: FormattingOptions = {
  tabSize: 1,
  insertSpaces: true,
  other: '' // witout the  index signature this would be invalid.
};

edited Aug 31, 2022 at 15:37

Xiangming Hu

3756 silver badges7 bronze badges

answered Jun 1, 2018 at 20:11

Titian Cernicova-Dragomir

253k37 gold badges465 silver badges395 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Socrates Over a year ago

Does this mean that I can add as many new properties as I wish? Could I also add mouse: 'tippy' and car: 'BMW' and still have the variable f in this example be valid?

Titian Cernicova-Dragomir Over a year ago

@Socrates Yup, as long as the extra properties are of type boolean, number or string .

Collectives™ on Stack Overflow

How to understand syntax in TypeScript interface [key: string]

1 Answer 1

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related