unexpected token = for class properties in node 8.4

Question

running the following code in node (v8.4)

class TodoStore {
    todos = [];

    get completedTodosCount() {
        return this.todos.filter(
            todo => todo.completed === true
        ).length;
    }

    report() {
        if (this.todos.length === 0)
            return "<none>";
        return `Next todo: "${this.todos[0].task}". ` +
            `Progress: ${this.completedTodosCount}/${this.todos.length}`;
    }

    addTodo(task) {
        this.todos.push({
            task: task,
            completed: false,
            assignee: null
        });
    }
}

const todoStore = new TodoStore();

todoStore.addTodo("read MobX tutorial");
console.log(todoStore.report());

todoStore.addTodo("try MobX");
console.log(todoStore.report());

todoStore.todos[0].completed = true;
console.log(todoStore.report());

todoStore.todos[1].task = "try MobX in own project";
console.log(todoStore.report());

todoStore.todos[0].task = "grok MobX tutorial";
console.log(todoStore.report());

gives me the following error:

        todos = [];
              ^

SyntaxError: Unexpected token =
    at createScript (vm.js:74:10)
    at Object.runInThisContext (vm.js:116:10)
    at Module._compile (module.js:537:28)
    at Object.Module._extensions..js (module.js:584:10)
    at Module.load (module.js:507:32)
    at tryModuleLoad (module.js:470:12)
    at Function.Module._load (module.js:462:3)
    at Function.Module.runMain (module.js:609:10)
    at startup (bootstrap_node.js:158:16)
    at bootstrap_node.js:598:3

see https://mobx.js.org/getting-started.html -> why is it allowed on the client side? — Elad Katz, Nov 27 '17 at 18:15
That's handled by a Babel plugin. https://babeljs.io/docs/plugins/transform-class-properties/ — SLaks, Nov 27 '17 at 18:17
@EladKatz it's at stage 2. Google how the TC 39 acceptance process works. — Jared Smith, Nov 27 '17 at 18:21

Jeffrey Westerkamp · Accepted Answer · 2019-12-09T18:22:59.120

29

Update
Support for instance class fields starts with node >= 12.

Literal class properties are not supported by any version of node, according to this table. You'll still have to set any instance properties inside your class constructor:

class TodoStore {

    constructor() {
        this.todos = [];
    }
    // ...
}

If you wish to define a static property, you'd assign that directly to the TodoStore reference, after the class has been declared:

TodoStore.todos = [];

edited Dec 09 '19 at 18:22

answered Nov 27 '17 at 18:07

Jeffrey Westerkamp

5,949
1
17
27

take a look here: https://mobx.js.org/getting-started.html - how come it's used there then? why is it ok on the client? – Elad Katz Nov 27 '17 at 18:14
That code is most certainly being transpiled to standard ES5 JS code before it is run. The most commonly used tool for that is [BabelJS](https://babeljs.io/). There's nothing that would prevent you to do the same, but the code will for now simply not work in node natively, or any other widely adopted environment. – Jeffrey Westerkamp Nov 27 '17 at 18:24
2

It's now available in the nightly Node v 12. +1 for linking the table to help make future-proof the answer, plus it's useful for other features as well. – junvar Mar 21 '19 at 22:33
At first this answer mislead me into believing it is not yet supported in ANY version of node. Answer should specify that any prior to version 12 – bojer Dec 09 '19 at 14:27
It's there now. – Jeffrey Westerkamp Dec 09 '19 at 18:23

Michael McQuade · Answer 2 · 2019-03-22T11:09:03.657

3

Instance class fields will be supported as of Node v12, so one solution is to use a version >= 12 once it is released.

https://node.green/#ESNEXT-candidate--stage-3--instance-class-fields

For now if you're interested the nightly builds are at: https://nodejs.org/download/nightly/

edited Mar 22 '19 at 11:09

answered Mar 22 '19 at 11:04

Michael McQuade

3,234
1
19
31

unexpected token = for class properties in node 8.4

2 Answers2

Linked

Related