Transform Object Keys in TypeScript with Conditional Types

Have you ever needed to transform the keys of an object in TypeScript? Maybe you want to convert all keys to uppercase, lowercase, capitalize the first letter, or uncapitalize the first letter. Here's a powerful way to achieve that using TypeScript's conditional types.

Let's start by defining a set of literal types that represent the transformation options:

export type TLiteral = "UPPER" | "LOWER" | "CAPITALIZE" | "UNCAPITALIZE";

Now, we can create a generic type called TransformKeys that takes two type parameters: the target type T and the transformation type L. This type will map the keys of T based on the transformation specified by L. Here's how it looks:

export type TransformKeys<T, L extends TLiteral> = {
  [K in keyof T as L extends "UPPER"
    ? Uppercase<string & K>
    : L extends "LOWER"
    ? Lowercase<string & K>
    : L extends "CAPITALIZE"
    ? Capitalize<string & K>
    : L extends "UNCAPITALIZE"
    ? Uncapitalize<string & K>
    : never]: T[K];
};

 Examples

Now, you can use the TransformKeys type to transform the keys of an object. Here are some examples:

 Transform keys to Uppercase:

type UpperCaseKeys = TransformKeys<typeof data, "UPPER">; // ? { NaMe: string; aGe: number; a: string; }

 Transform keys to Lowercase:

type LowerCaseKeys = TransformKeys<typeof data, "LOWER">; // ? { name: string; age: number; a: string; }

 Capitalize the first letter of keys:

type CapitalizeKeys = TransformKeys<typeof data, "CAPITALIZE">; // ? { NAME: string; AGE: number; A: string; } 

 Uncapitalize the first letter of keys:

type UncapitalizeKeys = TransformKeys<typeof data, "UNCAPITALIZE">; // ? { nAme: string; aGe: number; a: string; }

These transformations can be handy when you need to standardize or manipulate object keys in your TypeScript code. You can easily adapt the TransformKeys type to your specific needs by adding more transformation options or refining the existing ones.

Conclusion

In TypeScript, conditional types provide a powerful tool for dynamically transforming object keys based on specified conditions. The TransformKeys type we've defined in this article allows you to change keys to uppercase, lowercase, capitalize the first letter, or uncapitalize the first letter with ease.

This feature is particularly valuable in scenarios where you need to standardize or manipulate object keys, such as data processing or ensuring data consistency in your applications. By using the TransformKeys type, you can improve code maintainability and reduce the likelihood of errors related to key case sensitivity.

As TypeScript continues to evolve, conditional types remain a versatile and essential feature for writing type-safe code that meets the demands of complex real-world applications. When you encounter similar challenges in your TypeScript projects, consider using conditional types to simplify and enhance your codebase.

By mastering TypeScript's advanced type system and conditional types, you can take your code to the next level and build more robust, error-free applications.