Understanding the Record Type in TypeScript

The Record type is a utility type in TypeScript that allows you to create an object type whose property keys are specified by a given type, and whose property values are of a specified type. In this tutorial, we will explore the definition, syntax, and usage of the Record type.

Definition and Syntax

The Record type is defined as follows:

type Record<K extends string, T> = {
    [P in K]: T;
}

Here, K is a type that represents the property keys, and T is a type that represents the property values. The [P in K] syntax is called a "mapped type" or "index signature", which means that for each property key P in K, there will be a corresponding property value of type T.

Usage

The Record type can be used to create an object type with specific property keys and values. For example:

type CatName = 'miffy' | 'boris' | 'mordred';
type CatInfo = {
    age: number;
    breed: string;
}

const cats: Record<CatName, CatInfo> = {
    miffy: { age: 10, breed: 'Persian' },
    boris: { age: 5, breed: 'Maine Coon' },
    mordred: { age: 16, breed: 'British Shorthair' },
};

In this example, the Record type is used to create an object type with property keys of type CatName and property values of type CatInfo.

Benefits

The Record type provides several benefits:

• Strong type safety: With the Record type, you can ensure that your objects have the correct property keys and values.
• Code completion: Many IDEs and code editors provide code completion suggestions based on the types in your code. The Record type helps with this by providing clear information about the expected property keys and values.
• Better error messages: If there are any errors in your code, the Record type can help the TypeScript compiler to generate more informative error messages.

Example Use Cases

Here are some example use cases for the Record type:

• Creating a configuration object with specific properties:

type NetworkConfig = Record<number, {
    name: string;
    ethUsdPriceFeed: string;
}>;

const networkConfig: NetworkConfig = {
    4: {
        name: 'rinkeby',
        ethUsdPriceFeed: '0x8A753747A1Fa494EC906cE90E9f37563A8AF630e',
    },
};

• Creating a dictionary-like object with specific keys and values:

type Statuses = 'failed' | 'complete';
type IconConfig = Record<Statuses, {
    iconType: string;
    iconColor: string;
}>;

const icons: IconConfig = {
    failed: { iconType: 'warning', iconColor: 'red' },
    complete: { iconType: 'check', iconColor: 'green' },
};

Conclusion

In conclusion, the Record type is a powerful utility type in TypeScript that allows you to create object types with specific property keys and values. Its benefits include strong type safety, code completion, and better error messages. With its flexible syntax and various use cases, the Record type can be a valuable tool for any TypeScript developer.