Search code examples
javascriptclassmemberstatic-membersecmascript-6

Member variables in ES6 classes


Is there any way to use the ECMAScript6 class notation to declare either a static class variable or a default value for an instance variable? Without class what I have in mind would be written as

function MyClass(arg) { if(arg) this.arg = arg; }
MyClass.classVariable = 42;
MyClass.prototype.arg = "no arg specified";

The most obvious ES6-like notation in my opinion would have been

class MyClass {
    constructor(arg) { if(arg) this.arg = arg; }
    static let classVariable = 42;
    let arg = "no arg specified";
}

But this doesn't work, since according to the current spec draft the only productions of ClassElement are static and instance methods and semicolons all by themselves. OK, one can use a pair of getter and setter methods to achieve similar semantics to what I outlined, but I guess at a severe performance penalty and with really bizarre syntax.

Is there some draft which suggests including variables in the class notation, one way or another? If so, what was the suggested syntax, where was it published, where was it discussed, how did the discussion go, and what's the current state of affairs on that front? As it stands, this question can't be answered if no such thing has been discussed before, at any level, but I consider that unlikely.


A bit of background: I'm currently toying with the Google closure compiler performing advanced compilation, using ES6 as input. For that to work, I need a place to put my type annotations for member variables, and I used to place them using syntax like /** @type {string} */ MyClass.prototype.arg; which is a semantic no-op in ECMAScript but provides the type information to the closure compiler nice and easy. I haven't yet found a similarly nice way to do this with a class construct. But if you care to address this aspect, that would be a comment. The question above is about member declarations which are more than no-ops, so that's what an answer here should discuss.


Solution

  • ES6 will almost certainly not cover syntax for defining class variables. Only methods and getters/setters can be defined using the class syntax. This means you'll still have to go the MyClass.classVariable = 42; route for class variables.

    If you just want to initialize a class with some defaults, there is a rich new syntax set for function argument and destructuring defaults you can use. To give a simple example:

    class Foo {
        constructor(foo = 123) {
            this.foo = foo;
        }
    }
    
    new Foo().foo == 123
    new Foo(42).foo == 42