Introduction to Keyof and Lookup Types

The keyof and lookup types in TypeScript allow you to work dynamically with keys and properties of existing types.

They make your code more flexible and reusable by letting you reference and extract types from objects.

What is keyof?

The keyof operator creates a type consisting of all the keys of an object type.

Example:

type Person = {
  name: string;
  age: number;
};
type PersonKeys = keyof Person;

What are Lookup Types?

Lookup types use square brackets [] to retrieve the type of a specific property of an object.

Example:

type Person = {
  name: string;
  age: number;
};
type NameType = Person['name'];

Combining keyof and Lookup Types

You can use keyof and lookup types together to create dynamic and reusable type constraints.

function getProperty<T, K extends keyof T>(obj: T, key: K): T[K] {
  return obj[key];
}

Use Cases for keyof and Lookup Types

Common use cases include:

• Creating dynamic APIs.
• Type-safe property access in objects.
• Improving code flexibility with type constraints.

Practical Example

Here’s a practical example where we combine keyof and lookup types:

type User = {
  id: number;
  username: string;
};

function printKey<T, K extends keyof T>(obj: T, key: K): void {
  console.log(`${key}: ${obj[key]}`);
}

const user: User = { id: 1, username: 'John' };
printKey(user, 'username');

Benefits of Using keyof and Lookup Types

These features offer:

• Dynamic property access with type safety.
• Reusable and scalable code.
• Better error prevention at compile time.

Practice Task

Create a function using keyof and lookup types to access properties dynamically from a user object. Try it out!

Congratulations!

You’ve learned how to use keyof and lookup types to make your code dynamic and type-safe. Keep practicing to master these advanced features of TypeScript!