How to Handle Errors Effectively in TypeScript

Error handling is one of those crucial aspects of programming that can make or break your application. When done right, it not only helps you maintain a stable application but also makes debugging a breeze. Let’s dive into some battle-tested strategies for handling errors effectively in TypeScript.

Understanding the Basics: Error Types

TypeScript provides several ways to handle errors, and knowing when to use each approach is key to writing robust applications. The foundation starts with understanding different types of errors we might encounter.

// Basic Error type
class NetworkError extends Error {
  constructor(message: string) {
    super(message);
    this.name = 'NetworkError';
  }
}

Custom Error Types: Your Best Friend

Creating custom error types isn’t just about being fancy - it’s about making your code more maintainable and easier to debug. Here’s how you can leverage them effectively:

interface ErrorWithCode {
  code: string;
  message: string;
}

class APIError extends Error implements ErrorWithCode {
  code: string;

  constructor(code: string, message: string) {
    super(message);
    this.code = code;
    this.name = 'APIError';
  }
}

The Art of Error Handling

When it comes to handling errors, there are several patterns we can follow. Let’s look at some practical examples:

async function fetchUserData(userId: string) {
  try {
    const response = await fetch(`/api/users/${userId}`);
    if (!response.ok) {
      throw new APIError('USER_NOT_FOUND', 'Unable to fetch user data');
    }
    return await response.json();
  } catch (error) {
    if (error instanceof APIError) {
      // Handle specific API errors
      logger.error(`API Error: ${error.code} - ${error.message}`);
    } else {
      // Handle unexpected errors
      logger.error('Unexpected error:', error);
    }
    throw error;
  }
}

Result Type Pattern: A Functional Approach

One elegant way to handle errors is using the Result type pattern. This approach makes error handling more explicit and helps prevent runtime errors:

interface Success\<T\> {
  success: true;
  data: T;
}

interface Failure {
  success: false;
  error: Error;
}

type Result\<T\> = Success\<T\> | Failure;

function processUserData(data: unknown): Result<User> {
  try {
    // Process and validate user data
    const validatedUser = validateUser(data);
    return {
      success: true,
      data: validatedUser
    };
  } catch (error) {
    return {
      success: false,
      error: error instanceof Error ? error : new Error('Unknown error')
    };
  }
}

Best Practices to Remember

1. Always type your error objects
2. Use custom error classes for different types of errors
3. Implement proper error logging
4. Handle errors at the appropriate level
5. Use type guards to narrow down error types
6. Consider using the Result pattern for critical operations

Remember, good error handling isn’t just about catching errors - it’s about making your application more reliable and easier to maintain.