用jsdoc记录匿名对象和函数的最佳方法


71

编辑:从技术上讲这是一个两部分的问题。我选择了涵盖一般问题并与处理特定问题的答案相关联的最佳答案。

用jsdoc记录匿名对象和函数的最佳方法是什么?

/**
 * @class {Page} Page Class specification
 */
var Page = function() {

    /**
     * Get a page from the server
     * @param {PageRequest} pageRequest Info on the page you want to request
     * @param {function} callback Function executed when page is retrieved
     */
    this.getPage = function(pageRequest, callback) {
    }; 
};

PageRequest对象或callback代码中都不存在。它们将getPage()在运行时提供。但是我希望能够定义对象和功能。

我可以创建PageRequest对象来证明这一点:

/**
 * @namespace {PageRequest} Object specification
 * @property {String} pageId ID of the page you want.
 * @property {String} pageName Name of the page you want.
 */
var PageRequest = {
    pageId : null,
    pageName : null
};

很好(尽管我愿意采取更好的方法来做到这一点)。

记录callback功能的最佳方法是什么?我想在文档中知道,例如,回调函数的形式为:

callback: function({PageResponse} pageResponse, {PageRequestStatus} pageRequestStatus)

任何想法如何做到这一点?

Answers:


55

您可以使用@name标记来记录代码中不存在的内容。

/**
 * Description of the function
 * @name IDontReallyExist
 * @function
 * @param {String} someParameter Description
*/

/**
 * The CallAgain method calls the provided function twice
 * @param {IDontReallyExist} func The function to call twice
*/
exports.CallAgain = function(func) { func(); func(); }

这是@name标签文档。您可能会发现名称路径也很有用。


真整洁!记录回调的好方法。
oligofren

1
但是我不知道这对匿名对象如何起作用?说一个设置对象,该对象将发送到某个函数中以创建在当前作用域中不可见的对象。
oligofren

1
如果您不想使用@name标签为匿名对象命名,请描述使用该对象的对象,该对象将是@param您的设置对象示例的标签主体。
埃里克

2
还有@callback标签。
kzh13年

47

您可以使用@callback@typedef

/**
 * @callback arrayCallback
 * @param  {object} element - Value of array element
 * @param  {number} index   - Index of array element
 * @param  {Array}  array   - Array itself
 */

/**
 * @param {arrayCallback} callback - function applied against elements
 * @return {Array} with elements transformed by callback
 */
Array.prototype.map = function(callback) { ... }

4
@ChrisMoschini谢谢。@callback答案中的标签已链接到相应的文档页面。
kzh 2014年

9

为了补充studgeek的答案,我提供了一个示例,该示例显示了 带有Google Closure Compiler的JsDoc可以帮助您完成什么。

请注意,已记录的匿名类型将从生成的缩小文件中删除,并且编译器确保在可能的情况下传入有效的对象。但是,即使您不使用编译器,它也可以帮助下一个开发人员和WebStorm(IntelliJ)之类的工具理解它并为您提供代码完成功能。

// This defines an named type that you don't need much besides its name in the code
// Look at the definition of Page#getPage which illustrates defining a type inline
/**  @typedef { pageId : string, pageName : string, contents: string} */
var PageResponse;

/**
 * @class {Page} Page Class specification
 */
var Page = function() {    
    /**
     * Get a page from the server
     * @param {PageRequest} pageRequest Info on the page you want to request
     *
     * The type for the second parameter for the function below is defined inline
     *
     * @param {function(PageResponse, {statusCode: number, statusMsg: string})} callback
     *        Function executed when page is retrieved
     */
    this.getPage = function(pageRequest, callback) {
    }; 
};

嗨,这似乎是最优雅的答案,但是JSDoc输出只包含function没有输入特定参数的内容。我正在使用jsdoc 3.4.0。是否完全不支持此语法?
ᆼᆺᆼ

1
@PeteV。我没有跟上jsdoc和闭包编译器之间的同步水平。我建议您查看与闭包编译器配合使用的其他doc生成器(因为它是jsdoc标准的超集)。尝试plovr.comseehuhn.de / pages/ jvjsdocgithub.com/google/closure-compiler/wiki/…。我已经开始使用TypeScript向JavaScript添加静态类型
Juan Mendes

2

@link 可以向方法和类添加内联链接。

/**
 * Get a page from the server
 * @param {PageRequest} pageRequest Info on the page you want to request
 * @param {function} callback Function executed when page is retrieved<br />
 * function({@link PageResponse} pageResponse,{@link PageRequestStatus} pageRequestStatus)
 */
this.getPage = function (pageRequest, callback) {
};

不理想,但是可以完成工作。


1

Google Closure编译器注释为此具有类型表达式,其中包括指示特定参数的类型,返回类型甚至是此类型的能力。许多图书馆正在考虑遵循Google Closure编译器注释,因为他们想使用它来缩小代码。所以它有一些动力。缺点是我看不到给出描述的方法。

为了提供描述,也许可以使用带有属性的JSDoc Toolkit Parameters方法(请看页面底部)。这就是我现在正在做的。JSDoc Toolkit正准备开始在V3上工作,因此可能会有好的反馈。


0

您可以使用@see链接到同一类中的另一个方法。该方法将永远不会被使用,它只是出于文档目的。

/**
 * @class {Page} Page Class specification
 */
var Page = function() {

    /**
     * Get a page from the server
     * @param {PageRequest} pageRequest Info on the page you want to request
     * @param {function} callback Function executed when page is retrieved
     * @see #getPageCallback 
     */
    this.getPage = function (pageRequest, callback) {
    }; 

    /**
     * Called when page request completes 
     * @param {PageResponse} pageResponse The requested page
     * @param {PageRequestStatus} pageRequestStatus Status of the page
     */
    //#ifdef 0
    this.getPageCallback = function (pageResponse, pageRequestStatus) { };
    //#endif 
};

如果您使用某种构建系统,则可以很容易从构建中省略虚拟方法。


不用了 我目前正在这样做(没有ifdef)并且可以工作,但是我希望用户能够立即看到它是一个接受参数X和Y的函数,而无需离开它们所在的位置。类似于Google Map API的操作方式。例如:code.google.com/apis/maps/documentation/javascript/…–
乔什·约翰逊

刚刚发现@link可以满足我的要求。这不是完美的,但可以。如果有人发现它有用,我将创建一个单独的答案。
乔什·约翰逊
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.