概要
JavaScript の変数の説明を JSDoc で書き、VSCode でその変数にカーソルをあてると、ツールチップにコメントが表示される。
例
/** ここにコメントが表示される */
const hoge = "hoge";
上のように書くと、以下のように表示される。

その他
関数
関数の説明も同様、かつ引数の説明も表示される。
/**
* ここにコメントが表示される
* @param fuga 第1引数のコメント
* @param piyo 第2引数のコメント
*/
function hoge(fuga: string, piyo: string) {
console.log(fuga, piyo);
}

オブジェクト
/** hoge のコメント */
const hoge = {
/** fuga のコメント */
fuga: "fuga"
};
console.log(hoge.fuga);
hoge
にカーソルをあてると、 hoge
の上のコメントが表示される。

fuga
にカーソルをあてると、 fuga
の上のコメントが表示される。

使い所
原則、使わなくて済む方がいい。その際には、
- コメントなしで意味が伝わる命名をする
- 関数の引数は命名だけでなく、TypeScript の型で情報量を増やす