TypeScript Tips and Tricks for Better Code Quality

TypeScript has become essential for modern JavaScript development. Here are some advanced tips to level up your TypeScript skills.

Advanced Type Patterns

Conditional Types

Conditional types allow you to create flexible type definitions:

type ApiResponse<T> = T extends string 
  ? { message: T } 
  : { data: T };

type StringResponse = ApiResponse<string>; // { message: string }
type DataResponse = ApiResponse<User>; // { data: User }

Mapped Types

Create new types by transforming existing ones:

type Partial<T> = {
  [P in keyof T]?: T[P];
};

type Optional<T, K extends keyof T> = Omit<T, K> & Partial<Pick<T, K>>;

Utility Types You Should Know

1. Pick: Select specific properties from a type
2. Omit: Exclude specific properties from a type
3. Record: Create an object type with specific keys and values
4. Exclude: Remove types from a union

interface User {
  id: number;
  name: string;
  email: string;
  password: string;
}

type PublicUser = Omit<User, 'password'>;
type UserCredentials = Pick<User, 'email' | 'password'>;

Generic Constraints

Use constraints to make your generics more specific:

interface Identifiable {
  id: string | number;
}

function updateEntity<T extends Identifiable>(entity: T, updates: Partial<T>): T {
  return { ...entity, ...updates };
}

Type Guards

Create custom type guards for runtime type checking:

function isString(value: unknown): value is string {
  return typeof value === 'string';
}

function processValue(value: unknown) {
  if (isString(value)) {
    // TypeScript knows value is string here
    console.log(value.toUpperCase());
  }
}

Conclusion

These TypeScript patterns will help you write more robust and maintainable code. Practice using them in your projects to become more proficient with TypeScript’s type system.