Why not object methods created with the class associated with it in ES6?

Question

I like ES6 classes, but I can’t understand why I have to bind methods in the constructor:

constructor() { this.someMethod = this.someMethod.bind(this) } 

I need to do this for almost any method.

Is this a real limitation or am I missing something? What is the reason for this? I know that classes in JS are just syntactic sugar, but that might be part of them.

Answer 1

To quote Mark Miller, answer the esdiscuss related post here:

Some of the class’s earliest sentences did this because they started with the semantics of es5 objects as closures and classes as components of features.

doku.php? do = search & id = quality

The idea was that language support would make this semantics effective, avoiding the need to willingly distribute closures on a method for each instance.

However, for obvious reasons, they could not gain momentum. Instead, we move on to sugar for the dominant coding model for es5 classes in prototype inheritance. Initially, we tried to make it just sugar, so that people could easily transform the code in this dominant template into classes.

As we struggled with detailed semantics around super and construction, es6 classes were different from pure sugar. But this deviation only prevents the painless refactoring of es6 classes into the dominant es5 model. It is almost painless to refactor from the es5 template to the es6 classes.

At zenparsing / es-function-bind # 17 we understood

we could still have binding methods when retrieving - taking behavior into account by deciding that the methods are installed on the prototype as the accessors whose bindings get. However, this implementation came too late for es6. Since this would make refactoring into classes more dangerous - rather a semantic change - it is not clear that he would fly even if we thought about it in time. Instead, with all the variations of the decorator’s designs, you can write a decorator so that the decorated methods are bound during extraction, explicitly creating this accessor property. However (!), If it is implemented as a user land decorator, it has much worse performance than objects like closures !! Objects as closures have a higher placement cost when selecting an object.

jsperf.com/creating-stateful-objects

But it’s quite efficient to use the object after creating the object:

jsperf.com/strict-where-state

(Note that jsperf incorrectly identifies Edge 28.14257.1000.0 as Chrome 46.0.2486. This is worth noting because Edge uses a transposed view for WeakMaps, and therefore using a private state based on WeakMap has a much lower penalty for Edge. Although this is in addition to the point this topic.)

In order to make a decorator for efficient binding during extraction, implementations will need some special case somewhere to avoid selection during an immediate method call, and not during extraction. The only thing TC39 needs to do to enable this is to standardize such a decorator so that implementations can provide it as a built-in function that they recognize.

And Kevin Smith answers:

In general, often there is a tension between improving the language (for some system of subjective values) and maintaining consistency. I think maintaining consistency was the right challenge in this case.

---

However, public class proposal fields allow you to define methods, such as how

 class Foo { someMethod = () => { // do stuff } } 

(instead of doing the same thing in constructor ).