【TypeScript】readonlyとは何ですか?
TypeScript

【TypeScript】readonlyとは何ですか?

作成日:2021年08月03日
更新日:2021年08月05日

例えば、次のオブジェクトがあるとします。

ts
type Profile = {
name: string;
age: number;
};
const profile: Profile = {
name: "田中",
age: 23,
};

nameを『田中』から『佐藤』へ変更してみます。

ts
profile.name = "佐藤";

console.logで確認すると、

image2

nameが『佐藤』になりました。

今回のように、勝手に書き換えたくないデータがある場合、readonly を使います。

書き方は、型を『<>』で閉じ、型の前に『Readonly』と入力します。

ts
const profile: Readonly<Profile> = {
name: "田中",
age: 23,
};

先程の[profile.name](http://profile.name/) = "佐藤";を確認してみましょう。

image3

エラーが発生し、『読み取り専用プロパティであるため、'name' に代入することはできません。』と指摘されました。

これで、profileオブジェクトの中身が上書きされることは、なくなりました。

© 2024あずきぱんウェブスタジオ