初級

is not assignable to type の原因と直し方

変数への代入・関数の戻り値・プロパティへの代入など、宣言した型と違う型の値を渡そうとしたときにtscが検出するエラーです。TypeScriptで最初に出会うエラーの1つです。

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

main.ts(4,7): error TS2322: Type 'string' is not assignable to type 'number'.

main.ts

ファイル名

4

行番号

7

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

TS2322

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

Type 'string' is not assignable to type 'number'.

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

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

 1  function summarize(age: number): string {
 2    return `age: ${age}`;
 3  }
 4  const age: number = "25";
                          ^
 5  console.log(summarize(age));

 1  function square(n: number): number {
 2    return n + "!";
                ^
 3  }
 4  console.log(square(4));

 1  interface Item {
 2    price: number;
 3  }
 4  const item: Item = { price: "9.99" };
                                   ^
 5  console.log(item.price);

 1  interface Order {
 2    qty: number;
 3  }
 4  const o: Order = { qty: "5" };
                             ^
 5  console.log(o.qty);

 1  function double(n: number): number {
 2    return n + "x";
                ^
 3  }
 4  console.log(double(3));

よくある誤解

「JavaScriptは動的型付けだから緩いはず」という感覚のままだと、これが構文エラーではなく型エラーだと気づきにくいことがあります。tscは実行前に型だけを見て機械的に判定しており、値の意味は考慮しません。

実務での勘所

TypeScriptの型チェックは、実行されるJavaScriptには一切残りません。tscは型情報を検査したあと、コンパイル結果からは型注釈をすべて取り除きます。つまり型エラーは開発時にだけ機能する安全網であり、tscを通さずに実行してしまえば、間違った型の値でもJavaScriptとしてはそのまま動いてしまいます。型の安全性は「ビルドパイプラインでtscのチェックを必ず通す」という運用があって初めて実効性を持ちます。

演習をはじめる

関連するエラー

• implicitly has an 'any' type の原因と直し方関数のパラメータに型注釈を付けないと、strictモードのTypeScriptは型を推論できず「暗黙のany」としてエラーにします。
• 必須プロパティの書き忘れエラーの原因と直し方interfaceで定義した必須プロパティを、オブジェクトリテラルで指定し忘れたときに出るエラーです。
• 引数の型が合わないエラーの原因と直し方関数やメソッドの引数に、パラメータの型と違う型の値を渡したときに出るエラーです。