Mapped types in TypeScript allow you to create new types by transforming the properties of existing types.
- They enable modifications like making properties optional, read-only, or altering their types.
- Mapped types help reduce code duplication and enhance type safety by automating type transformations.
- They are particularly useful for creating variations of types without manually redefining each property.
- PartialUser is a new type where each property of User is made optional.
- The keyof operator retrieves all keys from User, and the mapped type iterates over each key, marking them as optional with ?.
Output:
const user1: PartialUser = { id: 1 };
const user2: PartialUser = {};
const user3: PartialUser = { id: 2, name: "Alice" }; More Example of TypeScript Mapped Types
Creating Readonly Properties
- ReadonlyUser is a new type where all properties of User are marked as readonly.
- Attempting to modify any property of user will result in a compile-time error.
Output:
Error: Cannot assign to 'id' because it is a read-only property.
Creating Nullable Properties
- NullableProduct is a new type where each property of Product can be its original type or null.
- This allows properties to explicitly have a null value, indicating the absence of a value.
Output:
{ name: "Laptop", price: null, inStock: true }Renaming Properties with Template Literals
- PrefixedPerson creates a new type by prefixing each property of Person with 'person' and capitalizing the original property name.
- This demonstrates how to transform property names using template literal types and the Capitalize utility type.
Output:
{ personFirstName: "John", personLastName: "Doe" }Best Practices for Using TypeScript Mapped Types
- Keep Transformations Simple: Avoid overly complex nested transformations to maintain readability and ease of maintenance.
- Ensure Type Safety: Leverage mapped types to enforce consistent property transformations, enhancing type safety across your codebase.
- Combine with Utility Types: Utilize built-in utility types like Partial, Readonly, Pick, and Omit to simplify common transformations.