Class property inference from constructor initializations in JavaScript

[RyanCavanaugh]

Summary

We will support inferring the shape of classes from assignments to properties of this in the constructor body. Example:

// Was an error, now OK
class Foo {
  constructor() {
    this.greeting = 'hello!';
  }
}
// Also now OK
var x = new Foo();
console.log(x.greeting);

Rules

All or none

If you declare any properties, either using an initializer or non-initialized declaration, you must declare all members this way:

class Alpha {
  constructor() {
    this.size = 42; // OK
  }
}

class Beta {
  size: number;
  constructor() {
    this.siz = 42; // Error
  }
}

class Gamma {
  size = 100;
  constructor() {
    this.siz = 42; // Error
  }
}

Types of members

The type of each property is the union of all assignment sources:

class Alpha {
  constructor() {
    this.size = 42;
  }
}
var x = new Alpha();
var y = x.size; // y: number

Syntactic forms

Only assignments of the form this.name = expr; are recognized. Alternate syntax, e.g.this['name'] = expr, or aliasing of this (e.g. var x = this; x.foo = bar) will not create properties.

Open questions:

• Assignment statements only, or all assignment expressions? Chained initialization (this.x = this.y = 0) might be common
• Do parameter properties count as declared properties?

Other issues mentioning this: #766, #2393, #2606.

[jbondc]

Very nice. Probably all this. assignment expressions should work.

Think delete deserves some thought too:

class Alpha {
    constructor() {
        this.size = 42;
        delete this.size;
    }
}

[RyanCavanaugh]

What is the intent of that code? Does anyone actually do that? 😕 ❓

[jbondc]

Wasn't able to find any convincing cases in JS. Seen this in PHP sometimes ~ this._tmp can be used as temporary variable:
https://github.com/bluelovers/Scophp/blob/64f114e521ff607f83812391579f4f74809c2f10/Scorpio/Sco/Array/Sorter/Stable.php

Not a huge issue but part of the question: parameter properties count as declared properties?

If someone wants a pure ES6 way to declare properties, I guess delete could be a way to make something optional.

[jbondc]

More concrete:

class Alpha {
    constructor() {
         this.size = 42;
         this._tmp = {}
    }
}
class ImplementAlpha implements Alpha {}

Don't really want _tmp in there :/

[jkillian]

I assume the driving force behind this change is to let TS be able to mimic ES6-style JS classes? On one hand it seems like an unnecessary extra way to do things, but I like how it would let you copy over an ES6 class and be able to start using it with type-checking in TS.

I don't think there's a good answer for parameter properties. If they're considered declared properties, it disallows their use as shorthand in conjunction with the new this syntax. If they're not considered declared, it forces classes that don't want to use the new this syntax to have at least one non-parameter property field. I think the former of these two options is less harmful, so I'd vote to consider them declared properties (plus this is more backwards-friendly).

[RyanCavanaugh]

Done in JavaScript branch

[nycdotnet]

@RyanCavanaugh It sounds like this is only going to be in Salsa for now based on the design meeting notes - can you confirm that? Thanks.

[RyanCavanaugh]

@nycdotnet

It sounds like this is only going to be in Salsa for now

Correct