?: / readonly オプショナルプロパティと readonly プロパティ

最終更新：2026-10-22

? はプロパティをオプショナル（存在しなくてもよい）としてマークし、readonly はプロパティを読み取り専用（代入後に変更不可）としてマークします。オブジェクト型で最もよく使われる 2 つの修飾子です。

ℹ️ 説明 エディタは TypeScript を JavaScript にトランスパイルして実行します（型チェックなし）。型チェック結果は各サンプルの出力を参照してください。

📝 構文

interface Config {
  readonly name: string; // 読み取り専用：初期化後に変更不可
  retries?: number;      // 任意：省略できる
}

?:	オプショナルのマーク。オブジェクトリテラルでこのプロパティを書かなくてよくなります
readonly	読み取り専用のマーク。初期化後の再代入はコンパイルエラーになります（第 1 層のみ有効）

戻り値：戻り値はありません。両方の修飾子は純粋な型レベルの概念であり、コンパイル後には消えます。

下のコードを編集して「試す」を押すと、トランスパイル実行結果を確認できます：

出力：

shop localhost 8080

（トランスパイル後の実行出力。config.appName = "x" を書くとコンパイルエラーになります。appName は読み取り専用です）

ℹ️ 説明 オプショナルプロパティの型は自動的に undefined を含みます。strict 下では retries?: number は retries?: number | undefined と等価です。

⚠️ 注意 readonly が防げるのは「再代入」の 1 層だけです。readonly arr: number[] でも push は可能で、ネストしたオブジェクトのフィールドはそのまま変更できます。深いレベルの読み取り専用には Readonly<T> か as const を使います。

💡 ヒント オプショナルプロパティを読むときは ?? でデフォルト値を提供し（config.port ?? 8080）、ビジネスコードのあちこちで undefined を判定しないようにしましょう。

ケースは今後追加予定です。

Q readonly と const の違いは何ですか？

A const は「変数の束縛」を管理し（別の値を再び指すことはできません）、readonly は「オブジェクトのプロパティ」を管理します（そのフィールドを再代入できません）。const obj のフィールドは、readonly が付いていない限りそのまま変更できます。

Q オプショナルプロパティと型を T | undefined と書くのは違いますか？

A 違います。? は「プロパティ全体が存在しなくてもよい」ことを表します。a?: T | undefined は「存在は必須だが値は undefined でもよい」ことを表します。exactOptionalPropertyTypes を有効にすると両者は厳密に区別されます。

Q オブジェクト全体（ネストを含む）を読み取り専用にするには？

A Readonly<T> は第 1 層にしか作用しません。深いレベルの読み取り専用には as const（リテラルへ固定）か、再帰的な DeepReadonly 型を自作します。

Web-Tutorial 技術チーム

複数の開発者によって共同維持されているプログラミングチュートリアルプラットフォーム。各チュートリアルは専門分野の開発者が執筆・レビューしています。正確で信頼性の高いコンテンツを目指しています — 問題を見つけた場合はお知らせください。