フィールド、コンストラクター、パラメータープロパティ、public、protected、private と #private、readonly、abstract、implements を解説。各メンバーへのアクセス可否をライブの表で確認できます。
TypeScriptのクラスは、型付きのフィールドとアクセス規則を持つJavaScriptのクラスです。public メンバーはどこからでも、protected メンバーはクラスとそのサブクラスの中から、private メンバーはそのクラスの中からだけアクセスできます。この3つのチェックはコンパイル時にしか存在しません。#name フィールドは実行中のJavaScriptでも非公開になり、readonly はコンストラクターの後の書き込みを禁止します。
クラスのキーワードとその働き
修飾子を選ぶと、そのメンバーにコードがアクセスしうる5つの方法と、それぞれの tsc の結果が表に表示されます。意外に感じられやすいのはブラケットの行です。コンパイル時の修飾子は文字列キーで回避できますが、# フィールドは回避できません。
private はTypeScriptのチェックです。出力からは消え、obj["secret"] はコンパイルが通り、値も読めてしまいます。#secret フィールドはJavaScriptのプライベートフィールドで、到達できる文字列キーが存在せず、クラスの外のコードは実行時に読めません。
コンストラクターの引数からフィールドを宣言して代入する省略記法です。constructor(private readonly id: string) {} と書くと、本体なしで private readonly の id フィールドが作られます。接頭辞には public、protected、private、readonly が使えます。
いいえ。implements は完成したクラスがインターフェースに合っているかを確認するだけです。メソッドの引数には独自の型注釈が必要で、インターフェースが型を指定していても、strict モードで省略すると暗黙の any エラーになります。
strict で有効になる strictPropertyInitialization は、宣言したすべてのフィールドが宣言時かコンストラクター内で設定されることを求めます。値を与えるか、オプションにするか、使用前に別の何かが設定するなら名前の後に ! を付けます。
抽象フックを呼び出すメソッドのように、サブクラスが実際のコードを共有すべき場合は抽象クラスを使います。インターフェースはコードを持たず、1つのクラスが複数実装できるので、形を記述するのに向いています。
コンストラクターは引数リストで2つのフィールドを宣言しています。キャッシュは # フィールドなので、クラスの外からは読むこともクリアすることもできません。
describe は共有コードで、area は各図形が実装すべきフックです。noImplicitOverride が有効な場合、Circle の area には override キーワードが必要です。
インターフェースはクラスが正しい形の send を持つことを保証しますが、引数には独自の型注釈が依然として必要です。
制限はありません。修飾子を省略しても同じ意味です。
Account 自身のメソッドの中
Savings のメソッドの中
外部から、ドットで
外部から、文字列キーで
外部から、新しい値を代入
クラスとそのサブクラスに開かれています。型の規則にすぎないので、文字列キーならチェックを通り抜けます。
Account 自身のメソッドの中
Savings のメソッドの中
外部から、ドットで
外部から、文字列キーで
外部から、新しい値を代入
サブクラスにも閉じていますが、型チェック中だけです。ブラケット形式はコンパイルが通り、実行時には値を読めます。
Account 自身のメソッドの中
Savings のメソッドの中
外部から、ドットで
外部から、文字列キーで
外部から、新しい値を代入
JavaScriptのプライベートフィールドです。名前を指す文字列キーがないので外部からの経路はすべて失敗し、エンジンも実行時に同じ規則を強制します。
Account 自身のメソッドの中
Savings のメソッドの中
外部から、ドットで
外部から、文字列キーで
外部から、新しい値を代入
誰でも読めますが、生成後は誰も代入できません。クラス自身のメソッドでも同じです。
Account 自身のメソッドの中
Savings のメソッドの中
外部から、ドットで
外部から、文字列キーで
外部から、新しい値を代入
修飾子を選択
{v} メンバーへのアクセス
使用場所
コード
tsc の結果
コンパイル成功
無料で始める · クレジットカード不要