Wat is een JavaScript-klasse en hoe gebruikt u deze?

Bij objectgeoriënteerd programmeren is een klasse een uitbreidbare programmacode-sjabloon voor het maken van objecten. klassen kunnen in de eerste plaats worden gezien als een syntactische suiker over de bestaande op prototypen gebaseerde overerving van JavaScript. In dit artikel gaan we dieper in op de JavaScript-klasse en leren we hoe we ze in de volgende volgorde kunnen gebruiken:

• Wat is een JavaScript-klasse?
• Hoe gebruik je JavaScript Class?
  • Definieer een klasse
  • Definieer methoden
  • Een klas uitbreiden

Wat is een JavaScript-klasse?

In JavaScript is een klasse een type functie en wordt deze gedeclareerd met het trefwoord class. U moet de syntaxis van functie-uitdrukkingen gebruiken om een ​​functie te initialiseren en de syntaxis van klasse-uitdrukkingen om een ​​klasse te initialiseren.

// Een functie initialiseren met een functie-expressie const a = function () {}

// Initialiseren van een klasse met een klasse-uitdrukking const b = class {}

In JavaScript gebruiken we de trefwoordklasse in plaats van de trefwoordfunctie te gebruiken om het te starten. Ook worden de eigenschappen toegewezen binnen een constructor () - methode.

Hoe gebruik je een JavaScript-klasse?

De code gedeclareerd met functie en klasse retourneren beide een functie [[Prototype]]. Met prototypes kan elke functie een constructorinstantie worden met behulp van het nieuwe trefwoord. Bijvoorbeeld:

const a = class {} // Initialiseer een constructor vanuit een klasse const constructorFromClass = new a () console.log (constructorFromClass)

Uitgang:

een {} constructor: class

Nu zijn er drie verschillende manieren om class in JavaScript te gebruiken. Laten we met een voorbeeld de details van elke methode bespreken.

binair naar decimaal converter java

Definieer een klasse

Een constructorfunctie wordt geïnitialiseerd met een aantal parameters, die worden toegewezen als eigenschappen van 'deze' , verwijzend naar de functie zelf. De eerste letter van de identifier wordt volgens afspraak met een hoofdletter geschreven.

diep klonen en ondiep klonen in java

// Initialiseren van een constructorfunctie functie medewerker (naam, empid) {this.name = naam this.empid = empid}

Als we dit nu vertalen naar de klassesyntaxis, zul je zien dat de structuren erg op elkaar lijken.

// Initialiseren van een klasse-definitie klasse-medewerker {constructor (naam, empid) {this.name = naam this.empid = empid}}

We kunnen zeggen dat het class-trefwoord op een meer directe manier communiceert. Het enige verschil in de syntaxis van de initialisatie is het gebruik van het class-sleutelwoord in plaats van de functie. Het wijst ook de eigenschappen toe binnen een constructor () - methode.

Definieer methoden

Een andere veel voorkomende praktijk met constructorfuncties is het toewijzen van methoden rechtstreeks naar het prototype in plaats van in de initialisatie. We zullen een voorbeeld nemen en kijken hoe het werkt:

function employee (name, empid) {this.name = name this.empid = empid} // Een methode aan de constructor toevoegen employee.prototype.greet = function () {return `$ {this.name} zegt hallo`}

Wanneer u dezelfde code met class schrijft, wordt deze vereenvoudigd en wordt de methode direct toegevoegd.

class employee {constructor (name, empid) {this.name = name this.empid = empid} // Een methode aan de constructor toevoegen greet () {return `$ {this.name} zegt hallo`}}

Hoewel klassen een meer eenvoudige en beknopte syntaxis mogelijk maken, moet u soms een compromis sluiten met de duidelijkheid in het proces.

Een klas uitbreiden

Het voordeel van constructorfuncties en -klassen is dat ze kunnen worden uitgebreid tot nieuwe objectblueprints op basis van de ouder. Dit helpt bij het voorkomen van herhaling van code voor objecten die op elkaar lijken maar enkele aanvullende of meer specifieke functies nodig hebben.

Met de methode call () kunnen nieuwe constructorfuncties worden gemaakt op basis van de ouder. Bijvoorbeeld:

// Een nieuwe constructor maken op basis van de bovenliggende functie-info (naam, empid, salaris) {// Chain constructor met call employee.call (this, name, empid) this.salary = salaris}

Als we nu dezelfde code schrijven met class, wordt het super-sleutelwoord gebruikt in plaats van call om toegang te krijgen tot de bovenliggende functies.

// Door een nieuwe klasse aan te maken op basis van de bovenliggende klasse-info wordt werknemer {constructor (naam, empid, salaris) {// Chain constructor uitgebreid met super super (naam, empid) // Voeg een nieuwe eigenschap toe this.salary = salaris}}

Klassen bieden u een beknoptere manier om te creëren voorwerp blauwdrukken en constructorfuncties beschrijven op een meer specifieke manier wat er onder de motorkap gebeurt.

ringdiagram versus cirkeldiagram

Hiermee zijn we aan het einde van ons artikel gekomen. Ik hoop dat je hebt begrepen hoe je JavaScript Class moet gebruiken.

Nu je weet wat JavaScript Class is, kun je het door Edureka. Web Development Certification Training helpt u te leren hoe u indrukwekkende websites kunt maken met HTML5, CSS3, Twitter Bootstrap 3, jQuery en Google API's en deze kunt implementeren op Amazon Simple Storage Service (S3).

Heeft u een vraag voor ons? Vermeld het in het opmerkingengedeelte van 'JavaScript Class' en we nemen contact met u op.