Creating a type safe dictionary in TypeScript

A dictionary is a data structure that stores key-value pairs. The keys are unique, and the values can be of any type. Dictionaries are often used to store data in a way that is easy to look up and retrieve. Typescript being the strongly typed language it is allows us to create a type-safe dictionary which will be our focus for today.

In this article we will consider how we can create a type-safe dictionary in Typescript using the three following methods;

• Indexed Object
• Record Utility type
• Map Object

So let's dive into what we have for the day.

Indexed Object.

Suppose we want to create a dictionary type to store a list of books using the indexed object method our dictionary would look like this.

type BookType = {
  title: string;
  pages: number
};


type Book = {
  [key: string]: BookType
}

The type above tells the typescript compiler that any object that is of type Book should have a key which is a string and the value for the key should be an object of BookType. Let's create an object that conforms to this type.

let book: Book = {
  '001': {
    title: 'Mastery',
    pages: 200
  }
};

The [key: string] index allows us to use any value which is a string for the key, we can put a constraint on the values we expect as keys for the book dictionary. By specifying a string enum whose values will serve as the keys on the dictionary.

enum BookIndex {
  "BOOK_ONE" = "001",
  "BOOK_TWO" = "002",
};

type BookType = {
  title: string;
  pages: number
};

type Book = {
  [key in BookIndex]: BookType
}

Let's turn our attention to using the Record Utility type to do this.

Record Utility

The Record utility type is used to construct an object type whose property keys are strongly typed and whose property values are also strongly typed. This utility can be used to map the properties of a type to another type. Let's see how we can achieve this.

type BookType = {
  title: string;
  pages: number
};


type Book = Record<string, BookType>;

To constrain the keys that should be on the book dictionary we can pass in a literal union type as shown below;

type BookIndex = "001" | "002";

type BookType = {
  title: string;
  pages: number;
};

type Book = Record<BookIndex, BookType>;

Map

The final method which we will consider when it comes to creating a dictionary type in typescript is the Map object. The Map object is a built-in JavaScript object that can be used to create a dictionary type, let's see how we can recreate our book dictionary using a Map.

type BookType = {
  title: string;
  pages: number;
};

type Book = Map<string, BookType>;

To get strong typing for the keys on the Map then we need to use the same literal union type as we did with the Record utility type.

type BookIndex = "001" | "002";

type BookType = {
  title: string;
  pages: number;
};

type Book = Record<BookIndex, BookType>;

That's it for this video guys, hope you found it useful and super interesting, Leave the video a like and subscribe to the channel and turn on the bell notification and I'll see you in the next one.