What do square brackets mean where a field should be in typescript?

by

That is an index signature. From the TypeScript documentation:

Indexable types have an index signature that describes the types we can use to index into the object, along with the corresponding return types when indexing.

So, for example, you could define an interface for an indexable object like:

interface IArrayOfStrings {
    [index: number]: string;
}

This tells the compiler, that for any object of type IArrayOfStrings, any member accessed by the numerical index will be of type string.

So, this will compile without error:

interface IArrayOfStrings {
    [index: number]: string;
}

let words: IArrayOfStrings = ["foo","bar"];

let word: string = words[0];

But this will not:

interface IArrayOfStrings {
    [index: number]: string;
}

let words: IArrayOfStrings = ["foo","bar"];

let myNumber: number = words[0];

In your example, this line:

dispatchEvent(event: { type: string; [attachment: string]: any; }): void;

is describing a method dispatchEvent that accepts one parameter of type { type: string; [attachment: string]: any; }.

To make that type easier to understand, look at an interface that defines this type:

interface IEvent {
    type: string;
    [attachment: string]: any;
}

This tells the compiler that objects of type IEvent will have a string property called type, and elements of an IEvent object, accessed by the string index will be of any type.

So, something like this would compile without error:

interface IEvent {
    type: string;
    [attachment: string]: any;
}

let myEvent: IEvent = {
    type: 'some-event-type'
};

let eventType: string = myEvent["type"];

More Related Contents:

  1. Create a global variable in TypeScript
  2. How to use jQuery with TypeScript
  3. Way to tell TypeScript compiler Array.prototype.filter removes certain types from an array?
  4. Type definition in object literal in TypeScript
  5. Difference between Variance, Covariance, Contravariance and Bivariance in TypeScript
  6. How do I declare object value type without declaring key type?
  7. Typescript property does not exist on union type
  8. Specify method’s type without converting the method to property
  9. How to watch and reload ts-node when TypeScript files change
  10. Angular 2 View will not update after variable change in subscribe
  11. Can’t import CSS/SCSS modules. TypeScript says “Cannot Find Module”
  12. Type for “every possible string value except …”
  13. How to combine known interface properties with a custom index signature?
  14. Call a global variable inside module
  15. Obtaining the return type of a function
  16. tsc throws `TS2307: Cannot find module` for a local file
  17. What does the pipe(|) mean in typescript?
  18. How to map over union array type?
  19. Setting default value for TypeScript object passed as argument
  20. TypeScript: how to extract the generic parameter from a type?
  21. ts-node ignores d.ts files while tsc successfully compiles the project
  22. Typescript: accessing an array element does not account for the possibility of undefined return values
  23. What does enclosing a class in angle brackets “” mean in TypeScript?
  24. What’s the difference between ‘extends’ and ‘implements’ in TypeScript
  25. How to get argument types from function in Typescript [duplicate]
  26. Cannot redeclare block scoped variable
  27. How to make Typescript infer the keys of an object but define type of its value?
  28. Why does a Typescript type conditional on `T extends undefined`, with T instantiated with `boolean`, resolve T to `never`?
  29. TypeScript: deep partial?
  30. Is it possible to export * as foo in typescript

Leave a Comment