Reageer ES6-klassen


Klassen

ES6 introduceerde klassen.

Een klasse is een soort functie, maar in plaats van het sleutelwoord functionte gebruiken om het te starten, gebruiken we het sleutelwoord class, en de eigenschappen worden toegewezen binnen een constructor()methode.

Voorbeeld

Een eenvoudige klassenconstructor:

class Car {
  constructor(name) {
    this.brand = name;
  }
}

Let op de naam van de klasse. We zijn begonnen met de naam "Car", met een hoofdletter. Dit is een standaard naamgevingsconventie voor klassen.

Nu kunt u objecten maken met de klasse Car:

Voorbeeld

Maak een object met de naam "mycar" op basis van de klasse Car:

class Car {
  constructor(name) {
    this.brand = name;
  }
}

const mycar = new Car("Ford");

Opmerking: De constructorfunctie wordt automatisch aangeroepen wanneer het object wordt geïnitialiseerd.


w3schools CERTIFIED . 2022

Gecertificeerd!

Voltooi de React-modules, doe de oefeningen, doe het examen en word w3schools gecertificeerd!!

$95 INSCHRIJVEN

Methode in klassen

U kunt uw eigen methoden in een klasse toevoegen:

Voorbeeld

Maak een methode met de naam "present":

class Car {
  constructor(name) {
    this.brand = name;
  }
  
  present() {
    return 'I have a ' + this.brand;
  }
}

const mycar = new Car("Ford");
mycar.present();

Zoals u in het bovenstaande voorbeeld kunt zien, roept u de methode aan door te verwijzen naar de methodenaam van het object, gevolgd door haakjes (parameters zouden tussen haakjes staan).


Klasse Overerving

Gebruik het extends trefwoord om een ​​klasse-overerving te maken.

Een klasse die is gemaakt met een klasse-overerving, erft alle methoden van een andere klasse:

Voorbeeld

Maak een klasse met de naam "Model" die de methoden van de klasse "Car" erft:

class Car {
  constructor(name) {
    this.brand = name;
  }

  present() {
    return 'I have a ' + this.brand;
  }
}

class Model extends Car {
  constructor(name, mod) {
    super(name);
    this.model = mod;
  }  
  show() {
      return this.present() + ', it is a ' + this.model
  }
}
const mycar = new Model("Ford", "Mustang");
mycar.show();

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.

Bekijk onze sectie JavaScript-klassen voor meer informatie over lessen .