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

当ページのリンクには広告が含まれています。
いずみ

こんな悩みを解決できる記事を書きました!

僕は現役フリーランスエンジニア(歴年)で、資格は個保有しています。

TS2339エラーは型を明示していない場合に発生するエラーです。

詳しくは後ほど解説しますが、対処方法は非常に簡単なのでご安心ください。

本記事を読めば、TS2339エラーの原因と対処方法が理解できるので早速見ていきましょう!

いずみ

すぐ読み終わるので、ぜひ最後まで読んでくださいね!

執筆者/監修者
  • フリーランスエンジニア(保有資格個)
  • ブログ・アフィリエイト歴5年
  • ブランドせどりで月利50万円⇨脱サラ
  • 投資歴5年(仮想通貨・FXが得意)
  • Twitterフォロワー約2,000人
  • 運営者情報はこちら
いずみです
目次

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エラーの対処方法は何ですか?

型アサーションやasで明示する方法があります。

まとめ

今回は、TS2339エラーの原因と対処方法について解説しました。

以下が本記事のまとめになります。

まとめ
  • TS2339エラーは型を明示していない場合に発生するエラー。
  • TS2339エラーの原因は適切な型定義をしていないこと。
  • TS2339エラーの対処方法は型アサーションやasで明示すること。
まとめ♪
いずみ

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

  • クソおすすめ本
¥4,480 (2024/06/01 23:28時点 | Amazon調べ)
いずみ

海外のエンジニアがどういった思考で働いているかが理解できます。

海外に行く気はないけど海外エンジニアの動向が気になる雑魚エンジニアにおすすめです(本当におすすめな本しか紹介しないのでご安心を)。

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

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