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

【TypeScript】TS2339エラーの原因と対処方法を解説!
悩んでいる人

TS2339エラーが発生したんだけど、対処方法が分からないんだよね。。

こんな疑問にお答えします。

  • 本記事の内容
  • 本記事の信頼性
プロフィール
  • フリーランスエンジニア(保有資格約20個)
  • ブログ・アフィリエイト歴5年
  • ブランドせどりで月利50万円⇨脱サラ
  • Twitterフォロワー約2,000人
いずみん

本記事を書いている僕はエンジニア歴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エラーが発生します。

unkoCanvasHTMLElementと解釈されたためgetContextが存在しないと言われています。

TS2339エラーの原因

TS2339エラーは適切な型定義をしていない場合に発生します

先ほどの例だと、unkoCanvasHTMLCanvasElementではなく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で明示すること。

この記事があなたのお役に立てば幸いです。

サイト内には、他にも初心者向けの記事を多く投稿していますので良ければ参考にしてみてください。

最後までお読みいただきありがとうございました!

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

この記事が気に入ったら
フォローしてね!

シェアしてね!
  • URLをコピーしました!
目次