typescript interfaceのプロパティを読み取り専用にする

typescript interfaceのプロパティを読み取り専用にする

typescriptで、readonlyを使って、interfaceのプロパティを読み取り専用にするサンプルコード記述してます。typescriptのバージョンはVersion 4.1.2となります。

環境

  • OS windows10 64bit
  • typescript Version 4.1.2

readonly使い方

readonlyを使用すると、interfaceのプロパティを読み取り専用にすることが可能です。

例えば、以下のコードの場合はnumの値を変更することが可能ですが、

interface hoge {
    num: number;
    str: string;
}

const h: hoge = { num: 10, str: 'mebee' }

console.log(h.num) // 10
console.log(h.str) // mebee

h.num = 20

console.log(h.num) // 20

readonlyにnumを指定すると、値の変更ができないようになります。

interface hoge {
    readonly num: number;
    str: string;
}

const h: hoge = { num: 10, str: 'mebee' }

console.log(h.num) // 10
console.log(h.str) // mebee

h.num = 20
//error TS2540: Cannot assign to 'num' because it is a read-only property.

console.log(h.num) // 20