0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

【JSDoc】JavaScriptで型補完する

Last updated at Posted at 2020-09-14

どうしてもJavaScriptで書かないといけない状況に立たされた時、anyを作らないように開発することが大事になってくる。
そういった時にVSCodeなどに型情報を教えるための手段として、JSDocを用いた方法を紹介する。

注意

型アノテーションを記述するわけではないので、コンパイルエラーを発生させることはできません。
コンパイルエラーを発生させたいのならflow - https://flow.org/などを使う必要があります。
また、このような状況での解決策として、型定義ファイルを作成するのが一般的です。

JSDoc の @typeについて

ドキュメント

変数宣言(メゾットの宣言)の上にドキュメントを書くと、優秀なIDE上ではそのドキュメントを参照することができます。

Screen Capture_select-area_20200914212023.png

変数宣言では@type、メゾットには@param, @returnで型情報を付けることができます。

Screen Capture_select-area_20200914212345.png

Screen Capture_select-area_20200914212452.png

少しは変数の情報がわかりやすくなったのではないかと思います。

ここで注意ですが、型情報を追加しただけなので、型チェックを行いません。なので以下のようなバグコードを書かないようにしましょう。

Screen Capture_select-area_20200914212114.png

変数aは文字列ですがnumber型であるとの情報をつけたせいで、bの型がnumber型になってしまいました。
実際はstringなので良くないです。

まとめ

やっぱり生jsは書かないほうがいいと思います。

0
0
1

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?