TypeScript Record: How to use the Record Type in Typescript?

What is a TypeScript Record?

The Record utility type in TypeScript allows you to create a new type with specified properties and their types.

It’s useful when you want to ensure an object that has a specific set of properties.

Here’s the syntax for the Record type:

Record<Keys, Type>

Keys is a string, number, or symbol that represents the keys of the new type.

Type is the type of value that the properties will hold.

Here’s an example of how to use the Record type:

type StudentRecord = Record;

let students: StudentRecord = {
'Anna': 'Programming',
'Bea': 'Software Development',
'Criza': 'Web Development'
};

console.log(students);

Output:

  "Anna": "Programming",
  "Bea": "Software Development",
  "Criza": "Web Development"

In this example, StudentRecord is a new type where each property is a string (the student’s name) and each value is also a string (the student’s major).

The students the object is of type StudentRecord, so TypeScript will enforce that each property and value matches the types specified in StudentRecord.

Remember, TypeScript only checks the structure of the objects, not the actual values. So, as long as the structure of your object matches the Record type, TypeScript will consider it valid.

If you try to assign a value that doesn’t match the Record type, TypeScript will throw an error. This can help catch errors in your code before runtime.

In addition to that, the Record utility type creates a new type with specified properties and their types.

For example:

type Role = "admin" | "user" | "guest";
interface User {
  id: number;
  name: string;
}

const users: Record<Role, User> = {
  admin: { id: 101, name: "It" },
  user: { id: 1011, name: "Source" },
  guest: { id: 10111, name: "Code" }
};

In our example code, Role is a type that can be “admin”, “user”, or “guest”. User is an interface with properties id (a number) and name (a string).

The users constant is an object where each property is a Role and the value of each property is a User.

This is represented by the Record type.

So, for example, users.admin is a User with id 101 and name “It”.

How to use the Record Type in Typescript?

Here’s a step-by-step guide on how to use the Record utility type in TypeScript:

Step 1: Define the Record Type

First, we need to define the Record type. The Record type takes two parameters: the type of the keys and the type of the values.

type SampleRecord = Record;

In this example, SampleRecord is a new type where each property is a string and each value is a number.

Step 2: Declare a Variable with the Record Type

Next, declare a variable with the Record type you just defined.

let record: SampleRecord;

In this example, the record is a variable of type SampleRecord.

Step 3: Assign Values to the Record

Now, you can assign values to the record variable. Remember, the keys must be strings and the values must be numbers, as defined in SampleRecord.

record = {
'key1': 1,
'key2': 2,
'key3': 3
};

In this example, record is assigned three properties: key1, key2, and key3, with corresponding values 1, 2, and 3.

Step 4: Use the Record

Finally, you can use the record variable in your code. For example, you can log the values to the console.

console.log(record.key1); // Output: 1
console.log(record.key2); // Output: 2
console.log(record.key3); // Output: 3

In this example, the values of key1, key2, and key3 are logged to the console.

That’s it! You’ve successfully used the Record utility type in TypeScript.

Remember, TypeScript is a statically typed language, so it will check the types at compile time.

If you try to assign a value to record that doesn’t match the Record type, TypeScript will throw an error.

This can help catch errors in your code before runtime.

Conclusion

The Record utility type in TypeScript is a powerful tool that allows you to create a new type with specified properties and their types. It’s particularly useful when you want to ensure an object has a specific set of properties.

The article provides examples of how to use the Record type, including defining a Record type, declaring a variable with the Record type, assigning values to the Record, and using the Record in your code.

It emphasizes that TypeScript checks the structure of the objects, not the actual values, and will throw an error if you try to assign a value that doesn’t match the Record type.

I hope this article has given you some insights and helped you understand the TypeScript Record.

If you have any questions or inquiries, please don’t hesitate to leave a comment below.

Leave a Comment