「TypeScriptの型入門」で手を動かす - その4

本日は「TypeScriptの型入門」の「クラスの型」からです。

qiita.com

クラスの型

  • 最近のJSにはクラスを定義する構文がある
    • ES2015(ES6)で使えるようになった
  • TypeScriptではクラスを定義すると同時に同名の型も定義される
    • なるほどクラス定義≒型定義
  • 注意すべきこと
    • TypeScriptはあくまで構造的型付けを採用している
    • JavaScriptお実行時にはあるオブジェクトがあるクラスのインスタンスかどうかはプロトタイプチェーンによって決まる
    • TypeScriptの型の世界はそうではない。
    • 同一の型のプロパティをもっていれば代入可能

JavaScriptのクラス式

TypeScriptのクラス構文はほぼJavaScriptの構文と同じのはず。 若干の違いはTypeScriptの公式チートシートにも記載があったような。

以下のClassesの部分かな。 www.typescriptlang.org

  • privateフィールドはTypeScript独自の拡張でランタイムに影響ない
  • #private（例：#itemみたいにフィールド名に#つける)はJSの記法、ランタイムでもprivateになる(はず)
  • JavaScritpと一緒と行ったが、readonyとか、?とか!とか、結構TypeScriptの記法もあるのかな。

プレイグラウンドで手を動かす

ジェネリクス

  • 型名をFoo<S, T> のようにすると、型の定義のなかでそれらの名前(S,T)を型変数として使うことができる
    • interface Foo<S, T>
    • obj: Foo<number, string>
      • interfaceの定義内で、Sがnumberに、Tがstringに置き換わる
  • クラスの場合「class Foo」
  • 関数の場合「function func」
  • どれも定義名称の後ろにジェネリクスをつける
  • 関数の場合はよびだすまでどのような型引数で呼ばれるかわからないから、型にも型変数が残った状態になる

プレイグラウンドで手を動かす

本日はここまで、ちょっと時間取れなかったから、ちょびっとだけ進みましたね。

次は「タプル型」から手を動かします！