メインコンテンツまでスキップ

クラスのreadonly修飾子

TypeScriptでは、フィールドにreadonly修飾子をつけると、そのフィールドを読み取り専用にできます。

読み取り専用フィールドは、コンストラクタかフィールド初期化子でのみ値を代入できます。

ts
class Octopus {
readonly name: string;
readonly legs = 8; // フィールド初期化子での代入はOK
 
constructor() {
this.name = "たこちゃん"; // コンストラクターでの代入はOK
}
}
ts
class Octopus {
readonly name: string;
readonly legs = 8; // フィールド初期化子での代入はOK
 
constructor() {
this.name = "たこちゃん"; // コンストラクターでの代入はOK
}
}

読み取り専用フィールドは、再代入しようとするとコンパイルエラーになります。

ts
const octopus = new Octopus();
octopus.legs = 16;
Cannot assign to 'legs' because it is a read-only property.2540Cannot assign to 'legs' because it is a read-only property.
ts
const octopus = new Octopus();
octopus.legs = 16;
Cannot assign to 'legs' because it is a read-only property.2540Cannot assign to 'legs' because it is a read-only property.

メソッド内の処理であっても、読み取り専用フィールドへの再代入は許されません。

ts
class Octopus {
readonly name = "たこちゃん";
 
setName(newName: string): void {
this.name = newName;
Cannot assign to 'name' because it is a read-only property.2540Cannot assign to 'name' because it is a read-only property.
}
}
ts
class Octopus {
readonly name = "たこちゃん";
 
setName(newName: string): void {
this.name = newName;
Cannot assign to 'name' because it is a read-only property.2540Cannot assign to 'name' because it is a read-only property.
}
}

関連情報

📄️ オブジェクト型のreadonlyプロパティ

TypeScriptでは、オブジェクトのプロパティを読み取り専用にすることができます。読み取り専用にしたいプロパティにはreadonly修飾子をつけます。読み取り専用のプロパティに値を代入しようとすると、TypeScriptコンパイラーが代入不可の旨を警告するようになります。

📄️ インターフェースのreadonly修飾子

TypeScriptのインターフェースでは、フィールドにreadonly修飾子をつけることで読み取り専用のフィールドが定義できます。
  • 質問する ─ 読んでも分からなかったこと、TypeScriptで分からないこと、お気軽にGitHubまで🙂
  • 問題を報告する ─ 文章やサンプルコードなどの誤植はお知らせください。