如何在JSDoc中正确定义自己的类类型?

时间:2017-09-30 16:20:28

标签: javascript ecmascript-6 webstorm jsdoc

我有一个简单的ES6类,我想知道如何在JSDoc中正确描述它。请注意,我想定义自己的类型,稍后将被WebStorm自动完成识别。

以下示例是否有效?

/**
* @typedef {Object} View
* @class
*/
class View{...}

1 个答案:

答案 0 :(得分:4)

这是一个非常好的问题。我今天的方法是在其构造函数中声明所有类实例变量,并使用其预期类型注释每个变量。这是一个很好的做法,与Webstorm很好地配合。例如:

class MyClass {

    constructor () {
        /** @type {Number} some number value */
        this.someNumber = 0;
        /** @type {String} some relevant string */
        this.someString = null;
        /** @type {Map<Number, Set<String>>} map numbers to sets of strings */
        this.strSetByNumber = new Map();
    }

    /**
     * Some sample function.
     * 
     * @param {Number} a - first value
     * @param {Number} b - second value
     * @return {Number} the resulting operation
     */
     someFunction(a, b) {
         return a + b;
     }
}

现在只需将某个变量声明为MyClass类型并享受自动完成功能:

auto-completion

如果您尝试为某些属性指定错误的类型:

enter image description here

然而,有时候,你甚至不需要申报课程。说,对于isntance,你希望通过JSON接收一个对象,你需要使用它。您可以使用纯JSDoc来帮助检查代码,而无需声明类。假设你期待像这样的JSON:

{
    "foo": "bar",
    "fizz": 42
}

而不是声明一个类,而是在代码中的某个位置执行此操作(我更喜欢将它始终放在将要使用它的脚本的顶部):

/**
 * @typedef {Object} MyType
 * @property {String} foo - this is some cool string
 * @property {Number} fizz - some number we also expect to receive
 * @property {Number} [bar] - an optional property
 */

那就是它!亲自尝试一下,看看Webstorm如何能够理解这两种方法。