Сonstructor - специальный метод, служащий для создания и инициализации объектов, созданных с использованием class. Для производных классов, constructor по умолчанию:
constructor(...args) {
super(...args);
}
У вас в родительском классе конструктор не инициализирует this.app:
constructor() {
this.app = document.querySelector('#city');
}
Вот ссылка на описание наследования https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Classes/extends
Еще есть такие описание:
'use strict';
class Animal {
constructor(name) {
this.name = name;
}
walk() {
alert("I walk: " + this.name);
}
}
class Rabbit extends Animal {
walk() {
super.walk();
alert("...and jump!");
}
}
new Rabbit("Вася").walk();
// I walk: Вася
// and jump!
Как видим, в new Rabbit доступны как свои методы, так и (через super) методы родителя.
Это потому, что при наследовании через extends формируется стандартная цепочка прототипов: методы Rabbit находятся в Rabbit.prototype, методы Animal – в Animal.prototype, и они связаны через proto.
Как видно из примера выше, методы родителя (walk) можно переопределить в наследнике. При этом для обращения к родительскому методу используют super.walk().
С конструктором – немного особая история.
Конструктор constructor родителя наследуется автоматически. То есть, если в потомке не указан свой constructor, то используется родительский. В примере выше Rabbit, таким образом, использует constructor от Animal.
Если же у потомка свой constructor, то, чтобы в нём вызвать конструктор родителя – используется синтаксис super() с аргументами для родителя.
Например, вызовем конструктор Animal в Rabbit:
'use strict';
class Animal {
constructor(name) {
this.name = name;
}
walk() {
alert("I walk: " + this.name);
}
}
class Rabbit extends Animal {
constructor() {
// вызвать конструктор Animal с аргументом "Кроль"
super("Кроль"); // то же, что и Animal.call(this, "Кроль")
}
}
new Rabbit().walk(); // I walk: Кроль
Для такого вызова есть небольшие ограничения:
Вызвать конструктор родителя можно только изнутри конструктора потомка. В частности, super() нельзя вызвать из произвольного метода.
В конструкторе потомка мы обязаны вызвать super() до обращения к this. До вызова super не существует this, так как по спецификации в этом случае именно super инициализирует this.
Второе ограничение выглядит несколько странно, поэтому проиллюстрируем его примером:
'use strict';
class Animal {
constructor(name) {
this.name = name;
}
}
class Rabbit extends Animal {
constructor() {
alert(this); // ошибка, this не определён!
// обязаны вызвать super() до обращения к this
super();
// а вот здесь уже можно использовать this
}
}
new Rabbit();