【TypeScript】TS2339エラーの原因と対処方法を解説!


TS2339エラーが発生したんだけど、対処方法が分からないんだよね。。
こんな疑問にお答えします。
- 本記事の内容
- 本記事の信頼性
本記事を書いている僕はエンジニア歴7年です。
TypeScript業務歴は3年なので、かなり有益な情報を発信できるかと思います。
TS2339エラーは型を明示していない場合に発生するエラーです。
詳しくは後ほど解説しますが、対処方法は非常に簡単なのでご安心を。
本記事を読んでいただければ、TS2339エラーの原因と対処方法がしっかりと理解できるので早速見ていきましょう!



すぐ読み終わるので、是非最後まで読んでみてください!
TS2339エラーとは
TS2339エラーは型を明示していない場合に発生するエラーです。
const unkoCanvas = document.getElementById("unkoCanvas");
const unkoContext = unkoCanvas.getContext("2d");
↑のようなコードを実行すると…
error TS2339: Property 'getContext' does not exist on type 'HTMLElement'
TS2339エラーが発生します。
unkoCanvasがHTMLElementと解釈されたためgetContextが存在しないと言われています。
TS2339エラーの原因
TS2339エラーは適切な型定義をしていない場合に発生します。
先ほどの例だと、unkoCanvasがHTMLCanvasElementではなくHTMLElementと解釈されたのがエラーの原因です。
TS2339エラーの対処方法
TS2339エラーは適切な型定義することで解決します。



対処方法は主に3つあります。
1. 型アサーションを使う
const unkoCanvas = <HTMLCanvasElement>document.getElementById("unkoCanvas");
const unkoContext = unkoCanvas.getContext("2d");
型アサーション<HTMLCanvasElement>を定義します。
2. asで明示する
const unkoCanvas = document.getElementById("unkoCanvas") as HTMLCanvasElement;
const unkoContext = unkoCanvas.getContext("2d");
asでHTMLCanvasElementを明示します。
3. anyを付与する
const unkoCanvas:any = document.getElementById("unkoCanvas");
const unkoContext = unkoCanvas.getContext("2d");
anyを付与します。



anyは型がないのと同じなのでおすすめしません。
よくある質問 | TS2339エラー
- TS2339エラーとは何ですか?
-
型を明示していない場合に発生するエラーです。
- TS2339エラーの原因は何ですか?
-
適切な型定義をしていないのが原因です。
- TS2339エラーの対処方法は何ですか?
-
型アサーションやasで明示する方法があります。
まとめ | TS2339エラー
今回は、TS2339エラーの原因と対処方法について解説しました。
以下が本記事のまとめになります。
- TS2339エラーは型を明示していない場合に発生するエラー。
- TS2339エラーの原因は適切な型定義をしていないこと。
- TS2339エラーの対処方法は型アサーションやasで明示すること。
この記事があなたのお役に立てば幸いです。
サイト内には、他にも初心者向けの記事を多く投稿していますので良ければ参考にしてみてください。
最後までお読みいただきありがとうございました!