TypeScriptでクラス情報を共有&ユーティリティ関数を提供！静的メソッドの定義と使い方を徹底解説

2024-05-21

TypeScript で静的メソッドにアクセスする方法

静的メソッドを定義するには、static キーワードをメソッド宣言の前に記述します。例えば、以下のコードは Person クラスに getNextId() という静的メソッドを定義します。

class Person {
  private static nextId = 1;

  public static getNextId(): number {
    return this.nextId++;
  }
}

静的メソッドへのアクセス

静的メソッドには、以下の2つの方法でアクセスできます。

クラス名を使って

const nextPersonId = Person.getNextId();
console.log(nextPersonId); // 2

インスタンスから
型注釈付きの this キーワードを使ってアクセスします。ただし、これは推奨されません。なぜなら、静的メソッドはインスタンスに依存しないため、インスタンスからアクセスするよりもクラス名からアクセスする方がより明確でわかりやすいからです。
```
const nextPersonId = Person.this.getNextId();
console.log(nextPersonId); // 2
```

静的メソッドの注意点

静的メソッドは、インスタンス変数にアクセスできません。
静的メソッドは、他の静的メソッドやインスタンスメソッドを呼び出すことができます。
オーバーロードは、静的メソッドに対してのみ許可されています。

静的メソッドは、TypeScript でクラス情報を共有したり、ユーティリティ関数を提供したりするのに役立つ強力な機能です。メソッドの定義方法とアクセス方法を理解し、適切な場面で使用することで、コードをより明確で保守しやすくなります。

静的メソッドのサンプルコード

Person クラスは、名前と年齢を持つ人を表すクラスです。このクラスには、getNextId() という静的メソッドが定義されています。このメソッドは、新しい Person インスタンスに割り当てるための ID を生成します。

class Person {
  private static nextId = 1;

  public name: string;
  public age: number;

  constructor(name: string, age: number) {
    this.name = name;
    this.age = age;
  }

  public static getNextId(): number {
    return this.nextId++;
  }
}

Point クラスは、x 座標と y 座標を持つ点を表すクラスです。このクラスには、原点からの距離を計算する getDistanceFromOrigin() という静的メソッドが定義されています。

class Point {
  public x: number;
  public y: number;

  constructor(x: number, y: number) {
    this.x = x;
    this.y = y;
  }

  public static getDistanceFromOrigin(point: Point): number {
    const distance = Math.sqrt(point.x * point.x + point.y * point.y);
    return distance;
  }
}

コードの使用例

以下のコードは、Person クラスと Point クラスの静的メソッドを使用する例です。

const person1 = new Person('Alice', 30);
const person2 = new Person('Bob', 25);

console.log(person1.name); // Alice
console.log(person2.age); // 25

const nextPersonId = Person.getNextId();
console.log(nextPersonId); // 3

const point = new Point(5, 10);
const distance = Point.getDistanceFromOrigin(point);
console.log(distance); // 11.180339887498949

このコードでは、まず Person クラスの 2 つのインスタンスを作成します。次に、Person.getNextId() メソッドを使用して新しい Person インスタンスに割り当てる ID を取得します。最後に、Point クラスの getDistanceFromOrigin() メソッドを使用して、原点からの点までの距離を計算します。

TypeScriptで静的メソッドにアクセスするその他の方法

型注釈付きの this キーワード

class Person {
  private static nextId = 1;

  public static getNextId(): number {
    return this.nextId++;
  }
}

const nextPersonId = Person.this.getNextId(); // 推奨されない方法
console.log(nextPersonId); // 2

ジェネリック型パラメータを使用して、静的メソッドを含むクラスの種類を指定できます。これは、コードをより柔軟で再利用しやすくするのに役立ちます。

class Person<T> {
  private static nextId = 1;

  public static getNextId(): number {
    return this.nextId++;
  }
}

const nextPersonId = Person<Person>.getNextId(); // ジェネリック型パラメータを使用
console.log(nextPersonId); // 2