Cannot define prototype properties within ES6 class definition

问题

I was trying ES6 syntax and find I cannot define prototype property or instance property within class defination, why forbids it?

I was using MyClass.prototype.prop=1 before, try ES7 by babel compiler as below, still cannot define prototype property.

class MyClass{
  prop=1;
  static sProp=1;
}

I don't think define instance property is any dangerous, there's 2 cases in my own browser game need prototype property:

1. Subclass instances need to inherit same property value from base class:

   var Building=function(){...}
   Building.prototype.sight=350;
   TerranBuilding.CommandCenter=...(CommandCenter extends Building)
   TerranBuilding.Barracks=...(Barracks extends Building)
   

So CommandCenter and Barracks will both have same building sight as 350.

new CommandCenter().sight===new Barracks().sight//All buildings have same sight

2. Buffer effect override original property and remove buffer
   

   Marine.prototype.speed=20
   var unit=new Marine()
   unit.speed===20//get unit.__proto__.speed 20
   unit.speed=5//Buffer:slow down speed, unit.speed will override unit.__proto__.speed
   delete unit.speed//Remove buffer
   unit.speed===20//true, speed restore
   

So I think it should add a way to set prototype property instead of forbid it completely, or can you give some other solutions to deal with above 2 cases?

回答1:

Neither of those will be on the class prototype.

The class Foo { bar = 1; } syntax will assign a value to the class instance, to be accessed with this.bar.

The class Foo { static bar = 1; } syntax will assign a value to the class constructor, to be accessed with Foo.bar.

There isn't much reason to use the prototype in this case. It will only complicate who actually owns the property and assigning a number in a few different classes will have very little overhead.

I would suggest the class instance property and just use this.sight everywhere you need it.

回答2:

I think the other answer didn't get the point of this question. The whole point of having inheritance is that you can decide when and where to override something. and if anyone think that's an overhead, why does ya use an OOP language at all?

I don't know why it's "forbidden" after all, but I could share some ideas. I'm pretty sure there is no way to define a Prototype Property with 'class' keyword. Any definition will be install on "hasOwnProperty". A huge setback is that in a constructor, there is no way to have any parents' constructors to interact with an overridden property.

To the point of reasoning, it's actually expelled by an other feature: you can use expressions to assign properties to this.

class A extends B { sight = this.getSight() * 3 }

When an expression excuses, it is either run with instance - created with constructor, or run at class declaration - when the prototype is created.

Accessors and methods don't have this problem. They are defined at prototype definition time and called at instance run time.

Property defined with expression with "=" is the return value of the expression. It is excused right after definition - should be the instance creation time, otherwise this could not be available.

So it's nothing about patterns. It's about having expressions or having inheritance. I definitely prefer inheritance, expressions are so pointless when you can write them right into the constructor.

class A extends B { constructor() { this.sight = this.getSight() * 3 } 

Using decorators are a nice work around. You can always do something with the prototype in javascript:

@B({sight:2}) class A {};

decorator B is:

function(option) {return function(clazz) {clazz.prototype.sight = option.sight; return clazz}}

来源：https://stackoverflow.com/questions/38311805/cannot-define-prototype-properties-within-es6-class-definition