JSDoc ToolKit~ javascript documentation ~

2011/12/26h13i32maru@Twitter

maruyama-r@KLab

自己紹介• 丸山 亮(h13i32maru) 最近はJSを触ってます

• KLab株式会社所属

http://twitter.com/h13i32maru

https://www.facebook.com/ryo.maruyama

https://github.com/h13i32maru

32 http://blog.h13i32maru.jp

ドキュメント大事ですよね

でも書くのは面倒(´・ω・｀)

じゃあせめてクラス・メソッドのリファレンスは書こう(・∀・)

Hoge Doc

• Java Docに代表されるHoge Docって結構ある

• Java Doc

• PHP Documenter

• Py Doc

• RDoc

JSDoc ToolKit

• Javascript用ドキュメントツール

• JSDocの後継

• @hoge foo barスタイルのJava Doc風

/** * @class /ALLIANCE/作成 * @author <a href="mailto:sano-n@klab.jp">Naohide Sano</a> (sano-n) * @extends KNGP.GLPage */var AllianceCreatePage = KNGP.GLPage.subclass(/** @lends AllianceCreatePage.prototype */{ /** * Sets current step on the page. * And control UI enabling. * @private * @param {Number} step */ _setStep: function(step) { //... }}

アノテーション

• 動的言語ならではのアノテーション

• @extends

• @lends

• @constructor

• @class, @function, @field

• @private

独自アノテーションも追加したいな(´・ω・｀)

プラグイン

• Javascriptでプラグインも簡単に作れる

• ドキュメント生成時の各ライフサイクルをフック

JSDOC.PluginManager.registerPlugin( "JSDOC.tagSynonyms", { onDocCommentSrc: function(comment) { comment.src = comment.src.replace(/@methodOf\b/i, "@function\n@memberOf"); comment.src = comment.src.replace(/@fieldOf\b/i, "@field\n@memberOf"); }, onDocCommentTags: function(comment) { for (var i = 0, l = comment.tags.length; i < l; i++) { var title = comment.tags[i].title.toLowerCase(); var syn; if ((syn = JSDOC.tagSynonyms.synonyms["="+title])) { comment.tags[i].title = syn; } } } });

注意点

• シノニムが結構ある

• @returns == @return

• @constructor == @constructs

• @augments == @extends

• etc...

おわり