如何在 JetBrains Webstorm/PHPStorm 中编写 oop javascript（带继承）以获得 autocompletion/intellisense

Question

有人可以写一个 OOP JS 代码示例吗？我假设带有注释，JetBrains IDE 可以在其中识别继承？例如

class Animal: 
 prop: weight
 method: run()

class Cat extends Animal:
 prop: name
 method: eat()

所以我希望 Webstorm/PHPStorm 自动完成并显示此类信息 (ctrl+q):

 Cat.prototype.eat= function(){
     this.weight; //should be recognized as inherited property
 }

 var cat = new Cat();
 cat.run(); //should be recognized as inherited method

最好的方法是什么？

Answer 1

以下将在没有任何注释的情况下工作：

var Animal = function () {
    this.weight = 0;
    this.run = function () {
    }
    return this;
};
var Cat = function () {
    this.name = "Tom";
    this.eat = function () {
        return "Nyam"
    }
    return this;
}

Cat.prototype = new Animal();
var cat = new Cat();

cat.run()

这种方式也有效：

function Shape() {
    this.x = 0;
    this.y = 0;
}

// superclass method
Shape.prototype.move = function(x, y) {
    this.x += x;
    this.y += y;
    console.info('Shape moved.');
};

// Rectangle - subclass
function Rectangle() {
    Shape.call(this); // call super constructor.
}

// subclass extends superclass
Rectangle.prototype = Object.create(Shape.prototype);
Rectangle.prototype.constructor = Rectangle;

var rect = new Rectangle();

此外，您可以在此处使用 JSDoc - 参见 http://usejsdoc.org/tags-augments.html，例如

如何在 JetBrains Webstorm/PHPStorm 中编写 oop javascript（带继承）以获得 autocompletion/intellisense

how to write oop javascript (with inheritance) in JetBrains Webstorm/PHPStorm to get autocompletion/intellisense

javascript

oop

inheritance

jetbrains-ide

webstorm