【JSDoc】アロー関数の引数にインラインで型指定する

JavaScript
2023-11-18

困ったこと

JSDocで型指定していても、エディタやプロジェクトの設定によってはアロー関数の引数を正しく型補完してくれないことがある。

/**
 * @typedef User
 * @prop {string} name
 * @prop {number} age
 */
/** @type {User[]} */
const users = [{ name: 'oteto', age: 20 }];

users.forEach((user) => {
  user.name; // => 未解決の変数 name
});

例えば上記ではuserがUserではなくanyと推論されてしまっている。

解決法

users.forEach((user) => {
users.forEach((/** User */ user) => {
  user.name;
});

/** @type User */のように@typeタグを使わないのは違和感があるが、WebStormの場合エディタに認識させるためにはこの方法しか無いっぽい。