Dynamic property names in flow typed object

javascript syntax flowtype
Sam Matthews picture Sam Matthews · Feb 11, 2017 · Viewed 7.9k times · Source

I'm slowly and surely working flowType into my code, but I'm struggling with one concept.

How do I specify the type of unknown, dynamically named properties of an object?

For example my user object might have an object containing organisations with unique keys.

How would I define this?

export type User = ?{
  currentOrg: string,
  displayName?: string,
  email: string,
  emailVerified: boolean,
  newAccount: boolean,
  organisations?: {
     UNKNOWNKEY?: string {
       orgData1: string,
       orgData2: string,
     }
  },
  uid: string,
  photoUrl?: string,
};

Would really appreciate any help on this. Thanks!

Answer

Peter Hall picture Peter Hall · Feb 12, 2017

Flow has specific syntax for objects that behave like maps:

{ [key: K]: V }

where K is they type of the keys and V is the type of the values.

Your full example would look like:

export type User = {
  currentOrg: string,
  displayName?: string,
  email: string,
  emailVerified: boolean,
  newAccount: boolean,
  organisations?: { [key: string]: string },
  uid: string,
  photoUrl?: string,
};

Related questions

How do I convert a float number to a whole number in JavaScript?

I'd like to convert a float to a whole number in JavaScript. Actually, I'd like to know how to do BOTH of the standard conversions: by truncating and by rounding. And efficiently, not via converting to a string and parsing.

Read More
What does "use strict" do in JavaScript, and what is the reasoning behind it?

Recently, I ran some of my JavaScript code through Crockford's JSLint, and it gave the following error: Problem at line 1 character 1: Missing "use strict" statement. Doing some searching, I realized that some people add "use strict"; into their JavaScript code. …

Read More
What is the preferred syntax for defining enums in JavaScript?

What is the preferred syntax for defining enums in JavaScript? Something like: my.namespace.ColorEnum = { RED : 0, GREEN : 1, BLUE : 2 } // later on if(currentColor == my.namespace.ColorEnum.RED) { // whatever } Or is there a more preferable idiom?

Read More