Type Your HashMaps with TypeScript
It’s my HashMap, I’ll do what I want to
First off, I know what you’re going to say. Why use your own HashMap if you can
make a Map or WeakMap? Sometimes, you just want to use a Plain Old
JavaScript Object (POJO). There could be a variety of reasons for this, maybe
you just need to keep track of data when iterating or maybe you’re working on
some arguments for a function.
function doCoolStuff(params: Params, options: OptionsMap) {
// cool stuff
}
In the case above, I might have a strictly typed Params, but the options could
vary, so I want to keep them pretty flexible. I use any a lot as a placeholder
and try to get away from it when I can. A cool option for this is to type a
hashMap.
// simple HashMap, assume it can take all string or boolean values
interface OptionsMap {
[key: string]: string | boolean;
}
const options: OptionsMap = {
cacheId: "u21987",
useDefaultValues: true,
responseAs: "json",
};
Looking at this code, we can type out the options so the values can be either a
string or a boolean. This allows users to enter any extra options they want
that are supported by this function. This is definitely useful if you work with
a development server for your back-end and want to pass special dev options for
testing.
Type Happy
You can even be more explicit and type the values to something more concrete.
interface User {
name: string;
level: number;
status: string;
}
interface HashMap<T> {
[key: string]: T;
}
// init the map
const userMap: HashMap<User> = {};
userMap["bob"] = {
name: "bob",
level: 12,
status: "afk",
};
Here, we’ve typed our HashMap to only accept values of T. This is pretty
useful when working with response data or possibly some cache implementation you
might build.
You can do more
This typed HashMap is a great way to start a building block of types in your
application. You might even move on to incorporatinbg
Utility Types.
You can mix and match these to do some amazing things with TypeScript. I just
wanted to cover a really simple way you can get started to move beyond typing
your still-in-progress types as any.