上級

型注釈（: Type）はプロパティを消さずに「見えなく」する。satisfiesとの違い

変数に: Typeという型注釈を付けると、その型に無いプロパティへのアクセスができなくなります。実行時にはプロパティ自体は残っていますが、型の上では「そんなものは無い」ものとして扱われます。satisfiesは元の値の型をそのまま保つため、この制限を受けません。

エラーメッセージの読み方

main.ts(4,20): error TS2339: Property 'z' does not exist on type 'Point'.

main.ts

ファイル名

4

行番号

20

列番号 — この位置でtscが検査に失敗しました

TS2339

エラーコード — 検索するとTypeScriptの解説が見つかります

Property 'z' does not exist on type 'Point'.

内容 — 期待していたもの、または受け付けられなかったもの

このエラーが出る典型パターン

 1  type Point = { x: number; y: number };
 2  const raw = { x: 0, y: 0, z: 5 };
 3  const origin: Point = raw;         
                     ^
 4  console.log(origin.z);

 1  type Item = { name: string };
 2  const raw = { name: "Pen", price: 100 };
 3  const item: Item = raw;         
                    ^
 4  console.log(item.price);

 1  type Config = { mode: string };
 2  const raw = { mode: "dark", debug: true };
 3  const cfg: Config = raw;         
                    ^
 4  console.log(cfg.debug);

 1  type Shape2 = { kind: string };
 2  const raw = { kind: "circle", radius: 5 };
 3  const shape: Shape2 = raw;         
                     ^
 4  console.log(shape.radius);

 1  type Setting = { key: string };
 2  const raw = { key: "vol", value: 10 };
 3  const setting: Setting = raw;         
                       ^
 4  console.log(setting.value);

よくある誤解

「型注釈を付けると、余分なプロパティは実際に消される」という考えは誤りです。消えるのは型情報の上での見え方だけで、実行時のオブジェクトには元のプロパティがそのまま残っています。

実務での勘所

satisfiesが追加される前は、: Typeという型注釈を使うと、その型に合っているかの検証は受けられる代わりに、実際の値が持っていたより詳しい型情報が失われる、という二者択一でした。TS 4.9で追加されたsatisfiesは、Typeに合致しているかの検証はしっかり行いながら、変数自体の型は元の値から推論された、より詳しい型のまま保持するという、両方の利点を同時に得るために設計されました。

演習をはじめる

関連するエラー

• 未定義プロパティを書いたエラーの原因と直し方interfaceに定義されていないプロパティを、オブジェクトリテラルに書いてしまったときに出るエラーです。
• 変数経由なら余分なプロパティが通る理由オブジェクトリテラルを直接関数に渡すと余分なプロパティはエラーになりますが、いったん変数に代入してから渡すとエラーになりません。