JavaScript-klasse wordt uitgebreid
Voorbeeld
Maak een klasse met de naam "Model" die de methoden van de klasse "Car" erft:
class Car {
constructor(brand) {
this.carname =
brand;
}
present() {
return 'I have a ' + this.carname;
}
}
class Model extends Car {
constructor(brand, mod) {
super(brand);
this.model = mod;
}
show() {
return this.present() + ', it is a ' + this.model;
}
}
mycar = new Model("Ford", "Mustang");
document.getElementById("demo").innerHTML
= mycar.show();
Definitie en gebruik
Het extends
sleutelwoord wordt gebruikt om een onderliggende klasse van een andere klasse (ouder) te maken.
De onderliggende klasse erft alle methoden van een andere klasse.
Overerving is handig voor herbruikbaarheid van code: hergebruik eigenschappen en methoden van een bestaande klasse wanneer u een nieuwe klasse maakt.
Opmerking: uit het bovenstaande voorbeeld; De super()
methode verwijst naar de bovenliggende klasse. Door de super()
methode aan te roepen in de constructormethode, roepen we de constructormethode van de ouder aan en krijgen we toegang tot de eigenschappen en methoden van de ouder.
Browserondersteuning
extends
is een ECMAScript6 (ES6)-functie.
ES6 (JavaScript 2015) wordt ondersteund in alle moderne browsers:
Chrome | Edge | Firefox | Safari | Opera |
Yes | Yes | Yes | Yes | Yes |
extends
wordt niet ondersteund in Internet Explorer 11 (of eerder).
Syntaxis
class childClass extends parentClass
Technische details
JavaScript-versie: | ECMAScript 2015 (ES6) |
---|
Gerelateerde pagina's
JavaScript-zelfstudie: JavaScript-klassen
JavaScript-zelfstudie: JavaScript ES6 (EcmaScript 2015)
JavaScript-referentie: het superzoekwoord
JavaScript-referentie: de constructor()-methode