TS Ep 40: Key Remapping with `as`

This is the final episode of our Intermediate module! We are closing it out with one of the most expressive features added to modern TypeScript.

1. The as Clause in Mapped Types

#

You can use the as keyword during a mapped type loop to transform the key string into a new string. This is heavily paired with Template Literal Types and intrinsic string utilities (like Capitalize).

Imagine converting an interface of plain values into an interface of getter functions, where every key is dynamically prefixed with get.

interface User {
  id: string;
  name: string;
  age: number;
}

// 1. `K in keyof User` iterates over: "id" | "name" | "age"
// 2. `K & string` ensures the key is a string (ignoring symbols).
// 3. `as get${Capitalize<...>}` computes the new key name!
type UserGetters = {
  [K in keyof User as `get${Capitalize<K & string>}`]: () => User[K];
};

/* Inferred Type:
{
  getId: () => string;
  getName: () => string;
  getAge: () => number;
}
*/

This pattern is heavily utilized in modern ORMs (like Prisma) and state machines (like XState) to generate type-safe utility functions automatically.

2. Filtering Keys (Mapping to never)

#

If you return never inside an as clause, TypeScript completely removes that key from the resulting object. This allows you to perform highly targeted exclusions without needing the Omit utility type.

Let’s strip the id and createdAt fields out of an entity mapping:

type AuditableEntity = {
  id: string;
  createdAt: string;
  payload: object;
};

// If K is "id" or "createdAt", return never (delete it). 
// Otherwise, return the original K.
type EditablePayload = {
  [K in keyof AuditableEntity as K extends "id" | "createdAt" ? never : K]: AuditableEntity[K];
};

/* Inferred Type:
{
  payload: object;
}
*/

3. Filtering by Value Type (The Holy Grail)

#

Combining Key Remapping (as) with Conditional Types (extends) allows you to filter an object based on the types of its Values, not just its Keys!

Imagine a massive state object, and you only want to extract the properties that contain function values, stripping out all the primitive data.

interface ComplexState {
  id: string;
  isActive: boolean;
  
  // Methods
  login: () => void;
  logout: () => void;
  refreshToken: (token: string) => boolean;
}

// 🟢 Extract Methods Only!
// Iterate over every key K. 
// Check if the VALUE (T[K]) is a function. 
// If yes, keep the key K. If no, delete it (never).
type MethodsOnly<T> = {
  [K in keyof T as T[K] extends (...args: any[]) => any ? K : never]: T[K];
};

type StateMethods = MethodsOnly<ComplexState>;

/* Inferred Type:
{
  login: () => void;
  logout: () => void;
  refreshToken: (token: string) => boolean;
}
*/

By filtering on values, you can build incredibly robust data mapping pipelines that automatically extract getters, setters, or specific primitives from massive nested objects.

Congratulations! 🎉

#

You have officially completed the Intermediate TypeScript module!

You have mastered the bridge between Runtime values and Type Space (typeof), dynamic key operations (keyof, Indexed Access), Generic constraints (extends), the built-in Utility Types (Partial, Extract, ReturnType), and you are now manipulating objects programmatically with Mapped Types.

In the final module, Advanced TypeScript, we will take everything you just learned and push it into Turing-complete territory: Distributive Conditional Logic, Type-Level Recursion, strict Tuple manipulations, and Type-Level State Machines!