TypeScriptのconst assertionをちゃんと理解したい

const assertionって？

const assertionを利用することのメリットは2つあります。

• readonlyにできる
• Literal TypesがWideningされない

実際のコードを見ながら理解していきましょう。

書き方

const user = {
  name: 'Haruki',
  age: 99
} as const

オブジェクトの末尾にas const付け加えるだけ。
readonlyなので、オブジェクトの値の変更はできません。

userInfo.name = 'Harry'
// Cannot assign to 'name' because it is a read-only property.

この『readonlyなので、オブジェクトの値の変更はできません。』という部分が非常に重要です。
これにより、 オブジェクトの値が変更できない = オブジェクトの値の型が変更できない ということになるので、Literal TypesのWideningが行われません。もう型推論によって勝手にstring型やnumber型などになりません。

ちなみに配列でも同様です。

const userGroup = ['Haruki', 'Harry', 'Lily', 'Baker'] as const

readonlyなので値の変更はできません。

userGroup[0] = 'Tom'
// Cannot assign to '0' because it is a read-only property.

readonlyとの違いは？

TypeScriptには以下のようなreadonlyの書き方があります。

type userInfo = {
  readonly name: string;
  readonly age: number;
};

const assetionとどう違うのかというと、readonlyはプロパティごとに宣言できるのに対し、const assetionはオブジェクト全体に宣言します。