サンプルコードで身につける: as const — 値をリテラル型で固定する

// let で受けると "dark" ではなく string に広がる(widening)
let themeChoice = "dark";
themeChoice = "light"; // string なのでどんな文字列でも入る
console.log(themeChoice);

// as const を付けると "dark" というリテラル型に固定される
let lockedChoice = "dark" as const;
console.log(lockedChoice);

// lockedChoice = "light"; // 型が "dark" なので別の文字列はエラー
lockedChoice = "dark"; // 同じ値なら再代入できる
console.log(lockedChoice);

// 通常の const: プロパティの型は string / number に広がり、書き換えもできる
const draftRequest = { httpMethod: "POST", timeoutSec: 30 };
draftRequest.httpMethod = "GET"; // 広い型なので通ってしまう
console.log(draftRequest.httpMethod);

// as const: 全プロパティがリテラル型かつ readonly になる
const fixedRequest = { httpMethod: "POST", timeoutSec: 30 } as const;
console.log(fixedRequest.httpMethod); // 型は "POST"
console.log(fixedRequest.timeoutSec); // 型は 30

// fixedRequest.httpMethod = "GET"; // readonly なのでエラー

// 値も個数も固定された readonly な組になる
const weekLabels = ["月", "火", "水", "木", "金"] as const;

// 読み取りは普段どおりできる
console.log(weekLabels[0]);
console.log(weekLabels.length); // 5(長さも型レベルで固定)

for (const dayLabel of weekLabels) {
  console.log(dayLabel + "曜日");
}

// weekLabels.push("土"); // readonly 配列に push は無いのでエラー
// weekLabels[0] = "日";  // 要素の書き換えもエラー

type ThemeName = "light" | "dark";

function applyTheme(themeValue: ThemeName): string {
  return themeValue === "dark" ? "黒背景に切り替え" : "白背景に切り替え";
}

// as const なら mode は "dark" というリテラル型のまま保たれる
const savedSetting = { mode: "dark" } as const;
console.log(applyTheme(savedSetting.mode));

// as const がないと mode は string に広がり、渡せなくなる
// const plainSetting = { mode: "dark" };
// applyTheme(plainSetting.mode); // string は ThemeName に渡せずエラー

// このAPIで許可するメソッドの一覧。二度と変わらない定数
const allowedMethods = ["GET", "POST", "DELETE"] as const;

type HttpMethod = "GET" | "POST" | "DELETE";

function describeMethod(methodValue: HttpMethod): string {
  if (methodValue === "GET") {
    return "データの取得";
  }
  if (methodValue === "POST") {
    return "データの作成";
  }
  return "データの削除";
}

// 要素はリテラル型なので、そのまま HttpMethod の引数に渡せる
for (const methodValue of allowedMethods) {
  console.log(methodValue + ": " + describeMethod(methodValue));
}