WebStorm / PhpStorm和JavaScript ES6：无法识别解构分配

Question

Consider this ES6 code:

class Person {
    constructor(first, last) {
        let fixed = this.normalize(first, last);
        this.first = fixed[0];
        this.last = fixed[1];
    }

    normalize(first, last) {
        return [first.toUpperCase(), last.toUpperCase()];
    }
}

PhpStorm/WebStorm has no problem recognizing that first and last are properties of the class when I later use them:

Now if I modify the constructor to use the destructuring assignment syntax :

constructor(first, last) {
    [this.first, this.last] = this.normalize(first, last);
}

The code executes without error, but the IDE can no longer see the properties:

Is this a problem with my code? My IDE settings? I use PhpStorm 2017.2.4

Answer 1

You can manually tell PHPStorm that these properties should be assumed to exist on Person -linked objects by adding a JSDoc to the class:

/**
 * @property {String} first
 * @property {String} last
 */
class Person {
    // ...
}