Mastering TypeScript's Type Guards for Robust Error Handling

When programming in TypeScript, handling errors correctly is crucial for building reliable applications. TypeScript's type guards allow you to precisely check types at runtime, making your error handling more robust and preventing bugs caused by unexpected data.

A type guard is a function or an expression that performs a runtime check to guarantee the type of a variable within a conditional block. This is especially helpful when dealing with unknown errors, or responses that might have different shapes.

Let’s start with a simple example of checking if an error is an instance of the built-in Error class:

function isError(value: unknown): value is Error {
  return value instanceof Error;
}

function handleError(e: unknown) {
  if (isError(e)) {
    console.log('Error message:', e.message);
  } else {
    console.log('Unknown error', e);
  }
}

In this example, the `isError` function acts as a type guard. When `handleError` calls it inside the if statement, TypeScript understands that inside the block, `e` is definitely an `Error`. This allows you to safely access properties like `message` without TypeScript errors.

Sometimes, errors come from multiple sources or have custom structures. Using type guards to discriminate between these custom error types helps you write clearer and safer error handling logic.

interface NetworkError {
  code: number;
  message: string;
  retryable: boolean;
}

interface ValidationError {
  field: string;
  message: string;
}

function isNetworkError(error: any): error is NetworkError {
  return typeof error.code === 'number' && typeof error.retryable === 'boolean';
}

function isValidationError(error: any): error is ValidationError {
  return typeof error.field === 'string';
}

function handleCustomError(err: unknown) {
  if (isNetworkError(err)) {
    console.log(`Network Error (code ${err.code}): ${err.message}`);
  } else if (isValidationError(err)) {
    console.log(`Validation Error in ${err.field}: ${err.message}`);
  } else {
    console.log('Unknown error:', err);
  }
}

Here, `isNetworkError` and `isValidationError` are type guards that check for specific properties unique to each error type. In `handleCustomError`, TypeScript narrows down the error's type depending on which guard passes, enabling access to type-specific fields without runtime errors.

Using type guards also helps when working with third-party libraries or APIs where error shapes might not be fully known upfront.

In summary, mastering TypeScript's type guards can drastically improve your error handling by providing:

- Safe, type-checked access to error properties - Clear differentiation between multiple error types - Less reliance on `any` or unsafe type assertions Start integrating type guards in your error handling code today for more predictable and maintainable TypeScript projects!