Skip to content

型システムの応用

公開日:November 16, 2024更新日:November 28, 2024
JavaScriptTypeScriptCoding📄

TypeScriptの型システムを活用することで、コードの柔軟性と安全性を向上させることができます。このセクションでは、ユニオン型と交差型、型エイリアス、型ガード、Nullableな型の扱いについて学んでいきます。

ユニオン型と交差型

ユニオン型

ユニオン型は、複数の型のうちのいずれかの型を持つことを示します。これにより、変数に複数の異なる型の値を割り当てることができます。

typescript
let value: string | number;
value = "Hello";  // OK
value = 42;        // OK
// value = true;  // エラー: 'boolean' 型は許可されていません

上記の例では、valuestringまたはnumber型のいずれかを持つことができます。これにより、柔軟なデータの取り扱いが可能になります。

交差型

交差型は、複数の型を組み合わせて1つの型を作ることができます。交差型は、すべての型のプロパティを含むオブジェクトを扱う場合に使います。

typescript
interface Person {
  name: string;
  age: number;
}

interface Employee {
  employeeId: number;
}

type Worker = Person & Employee;

let worker: Worker = {
  name: "Alice",
  age: 30,
  employeeId: 1234,
};

この例では、PersonEmployeeの両方を持つWorker型を作成しています。workerは両方のインターフェースのプロパティを持つ必要があります。

型エイリアス

型エイリアスを使うことで、複雑な型定義に対して別名を付け、コードを簡潔で読みやすくできます。型エイリアスはtypeキーワードを使って定義します。

typescript
type Point = {
  x: number;
  y: number;
};

let p1: Point = { x: 10, y: 20 };

この例では、Pointという型エイリアスを定義しています。これにより、Point型を使って簡潔に座標を表現することができます。

ユニオン型や交差型にも型エイリアスを使うことができます。

typescript
type StringOrNumber = string | number;
let value: StringOrNumber;
value = "Hello";
value = 42;

型ガード

型ガードは、ユニオン型などで異なる型のデータを扱う際に、実際の型を特定して適切な処理を行うために使用されます。typeofinstanceofを使って型を判別することが一般的です。

typescript
function printValue(value: string | number): void {
  if (typeof value === "string") {
    console.log(`文字列の値: ${value}`);
  } else if (typeof value === "number") {
    console.log(`数値の値: ${value}`);
  }
}

printValue("Hello"); // 文字列の値: Hello
printValue(100);      // 数値の値: 100

また、オブジェクトの型を判別する場合はinstanceofを使います。

typescript
class Dog {
  bark() {
    console.log("Woof!");
  }
}

class Cat {
  meow() {
    console.log("Meow!");
  }
}

function makeSound(animal: Dog | Cat): void {
  if (animal instanceof Dog) {
    animal.bark();
  } else if (animal instanceof Cat) {
    animal.meow();
  }
}

let dog = new Dog();
let cat = new Cat();
makeSound(dog); // Woof!
makeSound(cat); // Meow!

Nullableな型の扱い

TypeScriptでは、変数にnullundefinedが代入される可能性がある場合に、それを明示的に扱うことができます。これにより、nullundefinedによるエラーを防ぐことができます。

typescript
let value: string | null = null;
value = "Hello";

function greet(name: string | null): void {
  if (name === null) {
    console.log("Hello, Guest!");
  } else {
    console.log(`Hello, ${name}!`);
  }
}

greet(null);    // Hello, Guest!
greet("Alice"); // Hello, Alice!

--strictNullChecksオプションを有効にすることで、nullundefinedの扱いを厳密に管理できます。このオプションが有効な場合、nullundefinedを代入する可能性がある変数には明示的に型を指定しなければなりません。

typescript
let value: string | undefined;
value = undefined;
value = "Hello";

まとめ

TypeScriptの型システムを活用することで、コードの柔軟性と安全性を向上させることができます。ユニオン型や交差型を使うことで柔軟な型定義ができ、型エイリアスを使うことでコードを簡潔にできます。型ガードによってユニオン型の実際の型を特定し、Nullableな型の扱いでnullundefinedによるエラーを防ぐことが可能です。これらの応用的な型の使い方をマスターすることで、より堅牢で読みやすいコードを書くことができるようになります。