Наследование класса javascript ES6, почему нам нужен вызов super() из производного класса

... кажется, обязательно иметь функцию конструктора в базовом классе.

Не совсем. Если вы его не предоставили, один будет предоставлен вам движком JavaScript. Таким образом, всегда будет один (в этом смысле он обязателен), но его не нужно кодировать явно.

Когда вы вообще не определяете конструктор, конструктор по умолчанию, предоставляемый движком JavaScript для базового класса, будет выглядеть так:

constructor( ) { }

... и по умолчанию в производном классе будет выглядеть так:

constructor(...args) {
    super(...args);
}

Причина, по которой ваш пример не работает, заключается в том, что Derived имеет явный constructor, но constructor не вызывает super. Вы должны вызывать super из конструктора Derived, если вы явно определяете его.

если у производного класса есть конструктор, почему обязательно вызывать super из производного конструктора?

Потому что вы должны дать суперклассу возможность выполнить любую инициализацию нового объекта, которую он должен выполнить. В противном случае суперкласс не может гарантировать правильную работу, поскольку он может полагаться на инициализацию, выполненную его конструктором.

Так что либо:

1. Удалите свой constructor из Derived, сделав его похожим на ваш первый пример, чтобы движок JavaScript предоставил конструктор по умолчанию, или

2. Вызовите super из конструктора Derived.

В комментарии вы спросили:

но если базовый класс не имеет никакого конструктора, он все равно терпит неудачу, если производный класс имеет

Базовый класс всегда имеет конструктор, потому что, если вы его не предоставите (вы сделали это в коде в своем вопросе), предоставляется значение по умолчанию. Так что все равно придется звонить. Хотя его можно указать как необязательный, если ни один из суперклассов не имеет конструктора, отличного от значения по умолчанию, это добавило бы сложности и сделало бы явный конструктор Derived вводящим в заблуждение (без вызова super).

Есть также некоторые механические причины: this не определен, пока вы не вызовете super, но вам разрешено делать что-то до вызова super, поэтому выполнение вызова необходимо для обработки механики this в спецификации.

Это не обязательно, но если вы хотите присвоить свойства подклассу, вам нужно вызвать super в конструкторе, чтобы интерпретатор JavaScript знал, какие свойства принадлежат родительскому классу, а какие — подклассу.

Давайте сделаем пример.

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

class Animal {
  move () {
    console.log('moving');
  }
}

class Dog extends Animal {
  bark () {
    console.log('barking');
  }
}

Если мы хотим присвоить свойства подклассу, нам нужно вызвать super:

class Animal {
  move () {
    console.log('moving');
  }
}

class Dog extends Animal {
  constructor (name) {
    super();
    this.name = name;
  }
  bark () {
    console.log('barking');
  }
}

Причина в том, что в противном случае интерпретатор JavaScript не сможет узнать, принадлежит ли аргумент, переданный конструктору подкласса (name), родительскому классу или подклассу. Так что это нужно программисту, чтобы указать это.