TypeScript Record vs Object Explained with Real Examples

While working on a TypeScript project, you want to store some data, like a list of user roles and their permissions. Now you are not sure whether to use a Record or a normal Object.

This can be confusing for many developers. Knowing the difference between Record and Object will help you choose the right one and make your code better and easier to understand.

In this tutorial, we will explore the differences between TypeScript record vs object, explained with Real-World Examples, providing detailed explanations and examples to help you understand their usage.

Table of Contents

What is an Object in TypeScript?

In TypeScript, the object type is a type that represents any non-primitive value. It is a type that includes everything except numbers, strings, booleans, symbols, null, and undefined.

Example of an Object in TypeScript

let obj: object;
obj = { name: "John", age: 30 };  // Valid
obj = [1, 2, 3];                 // Valid
obj = function() {};             // Valid
obj = "hello";                   // Error: Type 'string' is not assignable to type 'object'

The object type is useful when you want to accept any non-primitive value but don’t care about the structure of the value.

Check out: Differences Between TypeScript and JavaScript

What is a Record in TypeScript?

The Record type is a utility type that allows you to define an object type with specific key-value pairs. It is a more structured way to define object types compared to the object type.

Syntax of Record in TypeScript

Record<Keys, Type>

Keys: The type of keys in the object.
Type: The type of values in the object.

Example of Record in TypeScript

let user: Record<string, number>;
user = { id: 1, age: 30 };  // Valid
user = { id: "1", age: 30 }; // Error: Type 'string' is not assignable to type 'number'

In this example, a user is an object where all keys are strings, and all values are numbers.

Check out: Differences Between Type and Interface in TypeScript

Key Differences Between TypeScript Record vs Object

Below, I have explained the key difference between records and objects in TypeScript, along with examples and an explanation.

1. Type Safety

Object: Provides less type safety as it only ensures the value is a non-primitive.
Record: Provides more type safety by enforcing specific key and value types.

2. Use Cases

Object: Use when you need a general non-primitive type without caring about the structure.
Record: Use when you need a well-defined structure with specific key and value types.

3. Flexibility

Object: More flexible as it can hold any non-primitive value.
Record: Less flexible but more predictable due to the enforced structure.

Detailed Examples of Object and Record in TypeScript

To better understand the difference, I have provided examples and explanations below.

Using Objects in TypeScript

Consider a scenario where you want to accept any non-primitive data.

function logObject(obj: object): void {
    console.log(obj);
}

logObject({ name: "Alice", age: 25 });
logObject([1, 2, 3]);
logObject(new Date());

In this example, logObject can accept any non-primitive value, making it very flexible but less type-safe.

Check out: Difference Between void and undefined in TypeScript

Using Record in TypeScript

Now, consider a scenario where you want to define a specific structure for an object.

type User = {
  id: number;
  name: string;
  age: number;
};

let user: User = {
  id: 1,
  name: "Alice",
  age: 25
};

user = {
  id: 1,
  name: "Alice",
  age: "25"  // Error: Type 'string' is not assignable to type 'number'
};

In this example, User is a Record type that ensures the object has the keys’ id’, ‘name’, and ‘age’, with values of type string or number.

Check out: Difference Between boolean and Boolean in TypeScript

Summary

Feature	Object	Record
Type Safety	Less type-safe	More type-safe
Flexibility	More flexible	Less flexible, more predictable
Use Case	General non-primitive type	Structured object with specific key-value types
Example	{ name: “John”, age: 30 }	{ id: 1, name: “Alice”, age: 25 }

Conclusion

Choosing between object and Record in TypeScript depends on your specific needs. If you require flexibility and don’t need a strict structure, Object is a suitable choice.

However, if you need a well-defined structure with specific types for keys and values, Record is a better option. Understanding these differences can help you write more type-safe and maintainable TypeScript code.