【JavaScript/TypeScript】 JSDoc/TypeDoc チートシート

【JavaScript/TypeScript】 JSDoc/TypeDoc チートシート

JSDoc および TypeDoc でよく使うブロックタグをまとめました。

TypeScript における TypeDoc を使用した JSDoc 書き出し

インストール

npm install typedoc

書き出し

typedoc --entryPointStrategy expand SOURCE_DIR --out OUT_DIR,

説明

記法: @description 説明文
JSDoc コメントの先頭でブロックタグなしで記載した文章は、 @description 扱いになる。

/**
 * 文字列 foo を出力する
 */
export function foo() {
    console.log('foo');
}

コメントの先頭以外に書く場合は @description を明示的に付ける。

/**
 * @returns {string} 文字列 foo
 * @description 文字列 foo を返す
 */
export function foo() {
    return 'foo';
}

返値

記法: @returns [{型}] [説明文]

/**
 * 文字列 foo を返す
 * @returns {string} 文字列 foo
 */
export function foo() {
    return 'foo';
}

引数

記法: @param [{型}] [引数名 [説明文]]

/**
 * @param {string} userName ユーザーの名前
 */
export function sayHello(userName) {
    alert('Hello ' + userName);
}

クラスや名前空間のプロパティ

記法: @property [{型}] [プロパティ名 [説明文]]

/**
 * 座標
 * @property {number} x X軸の値
 * @property {number} y Y軸の値
 * @property {number} distance 引数の Point からの距離を計算する
 */
export class Point {
    readonly x: number;
    readonly y: number;

    constructor(x: number, y: number) {
        this.x = x;
        this.y = y;
    }

    distance(p: Point): number {
        return Math.hypot(this.x - p.x, this.y - p.y);
    }
}

列挙型

記法: @enum [{型}]
各値の直前に doc コメントを挿入することで、各値の内容を説明できる。

/**
 * 季節
 * @enum {string}
 */
export const SEASONS = {
  /** 春 */
  SPRING: '春',
  /** 夏 */
  SUMMER: '夏',
  /** 秋 */
  AUTUMN: '秋',
  /** 冬 */
  WINTER: '冬'
};

投げうる例外

記法: @throws [{型}] [説明文]

/**
 * 引数が数値であれば引数を返す
 * @throws {TypeError} 引数が数値でない場合
 */
export function foo(x: any): number {
    if (typeof x !== 'number') {
        throw new TypeError('x is not a number');
    }
    return x;
}

コードブロック埋め込みによる例示

記法: @example [<caption>キャプション</caption>]
改行以降、次のブロックタグまでがコードブロックとして扱われる。

/**
 * 文字列 foo を返す
 * @examle
 * // returns 'foo'
 * console.log(foo());
 */
export function foo() {
    return 'foo';
}

@example の後ろで <caption></caption> を使用するとキャプションを付けられる。

/**
 * 引数が数値であれば引数を返す
 * @throws {TypeError} 引数が数値でない場合
 * @example <caption>成功する例</caption>
 * foo(1); // 1
 * @example <caption>失敗する例</caption>
 * foo('a'); // TypeError: x is not a number
 */
export function foo(x: any): number {
    if (typeof x !== 'number') {
        throw new TypeError('x is not a number');
    }
    return x;
}

補足情報 ※ TypeDoc 限定

記法: @remarks 説明文
description に追加して補足情報を記載します。

/**
 * ほげほげふがふが
 * @remarks ここに補足情報を書きます
 */
export function foo() {}

Share this article

facebook logohatena logotwitter logo

© Classmethod, Inc. All rights reserved.