Question

Let's say we are constructing a nested namespace where we will be prototyping multiple objects as needed. By default the object window.blah.foo is empty. We then prototype all the sub-objects and their functions in a single prototype. When documenting as we have below we show all the inner functions as globals. Now imagine you have dozens of files built this same way. How might we document this so that the .bar1(), bar2(), and bar3() functions are methods of the window.blah.foo object, especially when its instantiation occurs outside this file, possibly multiple times.

/**
 * Blah - Our very own global Namespace
 * @namespace
 * @type {object}
 * @global
 * @public
*/
window.blah = window.blah || {};

/**
 * Immediately-Invoked Function Expression (IIFE). 
 * @function
 * @param {object} w - Global window object.
 * @returns {Object} window.blah.foo
*/
(function (w) {

    // strict JS
    'use strict';

    /**
     * Create instance of w.blah.foo constructor
     * @constructor
    */
    w.blah.foo = function () {

   };

    /**
     * Append properties and methods to an instance of window.blah.foo
     * @constructor
    */
    w.blah.foo.prototype = {

        /**
         * Dummy function to return the number 1.
         * @method bar1
        */
        bar1: function () {
            console.log(1);
        },

        /**
         * Dummy function to return the number 2.
         * @method bar2
        */
        bar2: function () {
            console.log(2);
        },

        /**
         * Dummy function to return the number 3.
         * @method bar3
        */
        bar3: function () {
            console.log(3);
        }

    };

}(window));
Was it helpful?

Solution

The following will move the barX methods where they belong. Note that there's nothing for jsdoc to do with the doclet that documents the IIFE. The key to get the methods in the right place is /** @lends blah.foo# */. See the documentation of the @lends. The # tells jsdoc that the items lent to blah.foo belong to an instance of the class. See the documentation on namepaths for more details.

/**
 * Blah - Our very own global Namespace
 * @namespace
 * @global
 */
window.blah = window.blah || {};

/**
 * Immediately-Invoked Function Expression (IIFE).
 * @function
 * @param {object} w - Global window object.
 * @returns {Object} window.blah.foo
 */
(function (w) {
    // strict JS
    'use strict';

    /**
     * Create instance of w.blah.foo constructor
     * @constructor
     * @name blah.foo
     */
    w.blah.foo = function () {

    };

    /** @lends blah.foo# */
    w.blah.foo.prototype = {

        /**
         * Dummy function to return the number 1.
         */
        bar1: function () {
            console.log(1);
        },

        /**
         * Dummy function to return the number 2.
         */
        bar2: function () {
            console.log(2);
        },

        /**
         * Dummy function to return the number 3.
         */
        bar3: function () {
            console.log(3);
        }

    };

}(window));
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top