もうif-elseにさよなら！TypeScriptでスマートな型別分岐〜分岐処理をもっとスマートに

2024-06-17

TypeScriptにおける特定の型によるスイッチ

具体的な使用方法

function getLength(value: string | number): number {
  switch (typeof value) {
    case 'string':
      return value.length;
    case 'number':
      return value.toString().length;
    default:
      return 0;
  }
}

const strLength = getLength('Hello, World!'); // 13
const numLength = getLength(100); // 3

この例では、getLength関数は、引数 value の型に応じて、文字列の長さまたは数値の長さを返します。typeof演算子を使用して、value の型を検査し、対応するケースに処理を分岐させています。

型ガードの使用

TypeScript 3.7以降では、switch文内で型ガードを使用することができます。型ガードは、評価対象の値の型をより詳細に絞り込むための構文です。これにより、より安全で柔軟な条件分岐が可能になります。

function getLengthV2(value: unknown): number {
  if (typeof value === 'string') {
    return value.length;
  } else if (typeof value === 'number') {
    return value.toString().length;
  } else {
    return 0;
  }
}

const strLength = getLengthV2('Hello, World!'); // 13
const numLength = getLengthV2(100); // 3

上記の例では、getLengthV2関数は、型ガードを使用して、value が文字列であるかどうか、または数値であるかどうかをより明確に判断しています。これにより、コードの可読性と保守性が向上しています。

型安全性: switch文は、各ケースで処理される値の型を厳密にチェックするため、実行時エラーのリスクを低減できます。
コードの可読性: 従来のif-else分岐よりも、条件分岐のロジックをより分かりやすく表現できます。
保守性の向上: コード変更時の影響範囲を把握しやすくなり、メンテナンスが容易になります。

TypeScriptにおけるswitch文は、特定の型に基づいた条件分岐を可能にし、コードの型安全性、可読性、保守性を向上させる強力なツールです。従来のif-else分岐から積極的に移行することで、より堅牢で保守しやすいコードを開発することができます。

Example 1: Checking for Primitive Types

function getDataType(value: unknown): string {
  switch (typeof value) {
    case 'string':
      return 'String';
    case 'number':
      return 'Number';
    case 'boolean':
      return 'Boolean';
    case 'object':
      return 'Object';
    default:
      return 'Unknown';
  }
}

const strData = getDataType('Hello'); // 'String'
const numData = getDataType(100); // 'Number'
const boolData = getDataType(true); // 'Boolean'
const objData = getDataType({ name: 'John Doe' }); // 'Object'
const unknownData = getDataType(null); // 'Unknown'

In this example, the getDataType function determines the data type of the provided value using a switch statement. It checks for common primitive types (string, number, boolean) and objects, and returns a corresponding string representing the data type.

Example 2: Handling Enum Values

enum Color {
  Red,
  Green,
  Blue,
  Yellow
}

function getColorName(color: Color): string {
  switch (color) {
    case Color.Red:
      return 'Red';
    case Color.Green:
      return 'Green';
    case Color.Blue:
      return 'Blue';
    case Color.Yellow:
      return 'Yellow';
    default:
      return 'Invalid Color';
  }
}

const redColor = getColorName(Color.Red); // 'Red'
const greenColor = getColorName(Color.Green); // 'Green'
const blueColor = getColorName(Color.Blue); // 'Blue'
const yellowColor = getColorName(Color.Yellow); // 'Yellow'
const invalidColor = getColorName(10); // 'Invalid Color'

This example demonstrates using a switch statement to handle enum values. The getColorName function takes a Color enum value as input and returns the corresponding color name. It uses a switch statement to match the provided color value against the enum members and returns the corresponding string representation.

Example 3: Utilizing Type Guards

function getLengthOrArea(value: unknown): number {
  if (typeof value === 'string') {
    return value.length;
  } else if (typeof value === 'number') {
    if (value >= 0) {
      return Math.sqrt(value); // Assume it's a square area
    } else {
      return -1; // Invalid area for negative numbers
    }
  } else {
    return 0;
  }
}

const strLength = getLengthOrArea('Hello, World!'); // 13
const numLength = getLengthOrArea(10); // 10 (square root of 10)
const negativeNum = getLengthOrArea(-5); // -1
const invalidData = getLengthOrArea({}); // 0

In this example, the getLengthOrArea function utilizes type guards to handle different types of input values. It first checks for string and number types using typeof operator. For strings, it returns the length. For positive numbers, it assumes it's a square and returns the square root. For negative numbers, it returns -1 (invalid area). For any other type, it returns 0.

These examples showcase the versatility of switch statements in TypeScript, allowing for type-safe and concise conditional branching based on specific data types. By leveraging type guards, you can further enhance the logic and handle more complex scenarios.

TypeScriptにおける特定の型によるスイッチの代替方法

if-else分岐

最も基本的な方法は、if-else分岐を使用することです。各ケースを個別にチェックし、対応する処理を実行します。

function getLength(value: string | number): number {
  if (typeof value === 'string') {
    return value.length;
  } else if (typeof value === 'number') {
    return value.toString().length;
  } else {
    return 0;
  }
}

この方法はシンプルで分かりやすいですが、ケースが増えると冗長になり、可読性が低下する可能性があります。

型ガード付きif文

function getLengthV2(value: unknown): number {
  if (typeof value === 'string') {
    return value.length; // 型ガードにより 'value' は文字列であることが保証される
  } else if (typeof value === 'number') {
    return value.toString().length; // 型ガードにより 'value' は数値であることが保証される
  } else {
    return 0;
  }
}

この方法は、従来のif-else分岐よりも、より明確で型安全な条件分岐を実現できます。

パターンマッチングライブラリ

import { match } from 'ts-pattern-matching';

function getLength(value: unknown): number {
  return match(value)
    .with('string', (s: string) => s.length)
    .with('number', (n: number) => n.toString().length)
    .otherwise(() => 0);
}