Table of Contents
Despite the advent of the Map type, plain objects is an incredibly common way of representing a map. To support this paradigm, Flow offers a very flexible way to express this.
Where Object Maps are Useful
Let's say you want to write a function that totals the cost of a grocery list. Invoking it will look something like:
// This would return 9.5 (4 + 3 + 2.5).
getTotalCost({
eggs: 4,
fruitSnacks: 3,
toothpaste: 2.5,
});
The list can have any number of items, so you can't explicitly declare each item as a property. Also, you want to make sure it only takes numbers, so:
getTotalCost({
eggs: 4,
toothpaste: 2.5,
milk: 'Too much',
});
…would give a type error.
Declaring a Type as an Object Map
Like a lot of things with Flow, it's pretty simple. Just declare a typed key in brackets and give it a type:
type GroceryList = {
// The keys of the object will be strings. The values will be numbers.
[name: string]: number,
};
// From there, use it as any other type.
function getTotalCost(groceryList: GroceryList): number {
// Take the value of each property, return the sum.
}
getTotalCost will accept an object whose string keys have number values and give a type error for anything else:
// This works.
getTotalCost({
eggs: 4,
fruitSnacks: 3,
toothpaste: 2.5,
});
// Also okay.
getTotalCost({});
// Nope.
getTotalCost({
eggs: 4,
toothpaste: 2.5,
milk: 'Too much',
});
