Почему поля экземпляра принадлежат экземплярам, ​​а не их прототипу?

class синтаксис был просто синтаксическим сахаром для существующих вещей:

1. A prototype — объект с общими вещами между экземплярами, в основном методы и дескрипторы get-set.
2. A constructor — функция для создания объектов с предопределенным прототипом
3. Использование constructor в качестве пространства имен для хранения связанных вещей
4. Поля? Какие поля? У вас просто есть объект с прототипом, делайте с ним что хотите

class синтаксис включал все это... за исключением констант в прототипе - они имеют очень странное поведение (на самом деле являются инициализаторами свойств), и никто никогда их не использовал

До добавления открытых полей экземпляров эти свойства всегда принадлежали экземплярам ^{_{(except in some rather obscure usage)}}. И после добавления они продолжали хранить эти свойства в экземплярах.

В разделе 2.1 этой статьи доктора Акселя Раушмайера показана мотивация добавления публичных полей экземпляра.

Иногда у вас есть назначение в конструкторе, которое создает свойство экземпляра, но на него не влияют никакие другие данные в конструкторе (например, параметр).

class MyClass {
  constructor() {
    this.counter = 0;
  }
}

В таком случае вы можете использовать поле для переноса создания счетчика из конструктора:

class MyClass {
  counter = 0;
  constructor() {
  }
}

Таким образом, добавление публичных экземпляров может упростить конструкторы. Это также дает понять, что начальное значение свойства не зависит от аргументов конструктора. (Это также может улучшить читабельность и упростить документацию)

Существует также семантическая разница, поскольку поля класса используют семантику [[DefineProperty]] (с поведением, соответствующим Object.defineProperty), поэтому с общедоступными полями установщик в суперклассе не будет вызываться.

Сравнивать:

class A {
  set prop(value) {
    console.info('SETTER: '+value);
  }
}
class B extends A {
  constructor() {
    super();
    this.prop = 123; // (setter will be called, inherited from A)
  }
}
console.info(new B); //does not contain a 'prop' field because there is a setter

с

class A {
  set prop(value) {
    console.info('SETTER: '+value);
  }
}
class B extends A {
  prop = 123; //setter from A is not called
}
console.info(new B);

Что касается того, почему эти свойства принадлежали экземплярам, ​​а не прототипам (также применимо до того, как classes стали частью JS):

Если у вас есть свойство в прототипе, как только вы присвоите, скажем, instance1.property1 = 3, значение из прототипа больше не используется (затенение свойства); в экземпляре создается новое свойство, а значение в прототипе не изменяется. Поэтому помещать значение в прототип не очень полезно.

Напротив, метод обычно не переназначается, и полезно использовать его совместно между экземплярами. instance1.method1(...) и instance2.method1(...) вызывают одну и ту же функцию с разными this. (Так что это не псевдонимы друг друга, поскольку они имеют разные эффекты).