• ..

HTTP

    クラス

    クラスはClassで定義できます。 JavaScript と同じですね。同じなのでメソッドの定義の仕方やゲッターセッターなどはだいたい同じです。

    値の初期化

    クラスなのでconstructorで定義するのが一般的です。

    class A {
      value: number;
    
      constructor(value: number) {
        this.value = value;
      }
    }

    先に使うプロパティの型だけ定義しておいて、constructorでそこに代入する感じです。ですがこれだけなら、 TypeScript ではもっと短縮して書くことができます。以下は上の書き方と結果がまったく同じです。

    class A {  
      constructor(public value: number) {
      }
    }

    publicアクセス修飾子を付けています。これは他にprivateprotectedなどがありますがこれらの意味は、

    1. publicはどこからでもアクセス可能
    2. protectedはそれ自身、または継承したものからだけアクセス可能
    3. privateはそれ自身からしかアクセスできない

    です。例えば、privateを使う場合はこうなります。

    class A {  
      constructor(private value: number) {
      }
    }

    これを逆に短縮じゃない方法にすると、

    class A {
      private value: number;
    
      constructor(value: number) {
        this.value = value;
      }
    }

    のようになります。定義のほうでアクセス修飾子を付ける感じですね。

    constructor 以外で値の初期化

    TypeScript のstrictPropertyInitialization設定を有効にしているとconstructorで初期化していないプロパティは警告を受けます。例えば以下のような感じのときです。

    class A {
      // Property 'value' has no initializer 
      // and is not definitely assigned in the constructor.
      value: number;
    
      componentDidMount() {
        this.value = 123;
      }
    }

    もしcomponentDidMountが100%呼ばれるからvalueにはnumberが入っているんだと自信がある場合は、

    class A {
      value!: number;
    
      componentDidMount() {
        this.value = 123;
      }
    }

    value!: number;のように!を付けることで警告を回避できます。

    スタティック値

    スタティック値とは、プロトタイプではないそれ自信のプロパティ(クラス自体に生やす)の値のことです。これを定義するにはpublicのように頭にstaticと書くだけです。

    class A {
      static foo = 'static foo';
    }
    
    A.foo; // 'static foo'

    ジェネリクスなクラス

    クラス名のあとにジェネリクス型の設定を書くことができます。

    class A<T> {
      // ...
    }

    constructorまで自分で定義しているなら動的にTを解決できるかもしれませんし、もし設定してからじゃないと使えない場合は、

    const a = new A<Foo>();
    // T === Foo

    のように型を指定して使うことができます。