Leer hoe u lessen kunt maken in JavaScript

Leer hoe u lessen kunt maken in JavaScript

In 2015 werd de ES6-versie van de programmeertaal JavaScript uitgebracht. Deze release introduceerde enkele belangrijke upgrades van de taal en plaatste deze officieel in de categorie van objectgeoriënteerde programmeertaal, naast andere talen zoals Java en C++.





Objectgeoriënteerd programmeren richt zich op objecten en de bewerkingen die daarop kunnen worden uitgevoerd. Voordat u echter objecten kunt hebben, moet u een klasse hebben.



helaas zijn google play-services gestopt

JavaScript-klassen zijn een van de spelveranderende functies die bij de ES6-versie van de taal werden geleverd. Een klasse kan worden omschreven als een blauwdruk die wordt gebruikt om objecten te maken.





In dit zelfstudieartikel leert u hoe u objecten kunt maken en manipuleren met behulp van JavaScript-klassen.

JavaScript-klassenstructuur

Bij het maken van een klasse in JavaScript is er één fundamenteel onderdeel dat u altijd nodig zult hebben: de klas trefwoord. Bijna elk ander aspect van de JavaScript-klasse is niet vereist voor een succesvolle uitvoering.



Een JavaScript-klasse wordt op natuurlijke wijze uitgevoerd als er geen constructor is opgegeven (de klasse zal tijdens de uitvoering eenvoudig een lege constructor maken). Als er echter een JavaScript-klasse wordt gemaakt met constructors en andere functies, maar er geen class-sleutelwoord wordt gebruikt, is deze klasse niet uitvoerbaar.

De klas trefwoord (dat altijd in kleine letters moet zijn) is een noodzaak in de klassenstructuur van JavaScript. Het volgende voorbeeld is de algemene syntaxis van een JavaScript-klasse. De syntaxis van de JavaScript-klasse staat hieronder:



class ClassName{
//class body
}

Een klas maken in JavaScript

Bij het programmeren kan een klasse worden gezien als een gegeneraliseerde entiteit die wordt gebruikt om een ​​gespecialiseerd object te maken. In een schoolomgeving kan een gegeneraliseerde entiteit (een klas) bijvoorbeeld studenten zijn en kan een object van studenten John Brown zijn. Maar voordat u een object maakt, moet u weten welke gegevens het zal opslaan en dit is waar JavaScript Constructors in het spel komt.

Constructors gebruiken in JavaScript-klassen

Een constructor is om een ​​paar redenen van vitaal belang voor het proces voor het maken van klassen; het initialiseert de status van een object (via zijn attributen) en het wordt automatisch aangeroepen wanneer een nieuw object wordt geïnstantieerd (gedefinieerd en gemaakt).



Een constructorvoorbeeld gebruiken

Hieronder ziet u een voorbeeld van een constructor met een uitleg van wat het betekent.

class Student{
constructor(firstName, lastName, startDate){
this.firstName = firstName;
this.lastName = lastName;
this.startDate = startDate;
}
}

De bovenstaande code presenteert een belangrijk aspect van de JavaScript-klasseconstructor; in tegenstelling tot andere talen zoals Java en C++, gebruikt de constructer van een JavaScript de klassenaam niet om een ​​constructer te maken. Het gebruikt de bouwer trefwoord zoals u kunt zien in het bovenstaande voorbeeld.

Verwant: Leer hoe u klassen in Java kunt maken

De bouwer in het bovenstaande voorbeeld neemt drie parameters en gebruikt de dit sleutelwoord om de parameters toe te wijzen aan het huidige exemplaar van de klasse. Het lijkt misschien een beetje verwarrend, maar wat je moet begrijpen, is dat een klas kan worden gezien als een blauwdruk die wordt gebruikt om veel huizen te maken.

Elk gebouwd huis kan dan worden gezien als een object van deze klasse. Hoewel elk van deze huizen is gemaakt met dezelfde blauwdruk, zijn ze te onderscheiden door hun specifieke geografische locatie of de mensen die ze bezitten.

De dit trefwoord wordt gebruikt om elk object dat door een klasse is gemaakt, te onderscheiden. Het zorgt ervoor dat de juiste gegevens worden opgeslagen en verwerkt voor elk object dat met dezelfde klasse is gemaakt.

Een object maken in JavaScript

Constructors zijn belangrijk in een taal als JavaScript omdat ze het aantal attributen aangeven dat een object van een specifieke klasse zou moeten hebben. Sommige talen vereisen dat een attribuut (variabele) wordt gedeclareerd voordat het kan worden gebruikt in een constructor of andere methoden. Dit is echter niet het geval met JavaScript.

Gerelateerd: Variabelen declareren in JavaScript

Als je naar de constructor van de studentenklasse hierboven kijkt, kun je zien dat een object van deze klasse drie attributen heeft.

Voorbeeld van een object maken

Hieronder ziet u een voorbeeld voor het maken van een object in JavaScript.

//create a new object
const john = new Student('John', 'Brown', '2018');

De bovenstaande code gebruikt de Student class om een ​​object te maken.

Wanneer u een object van een klasse maakt, moet u de gebruiken nieuwe trefwoord, gevolgd door de klassenaam en de waarden die u aan de respectieve attributen wilt toewijzen. Nu heb je een nieuwe student met de voornaam John, de achternaam Brown en een startdatum van 2018. Je hebt ook een constante variabele: John. Deze variabele is belangrijk omdat je hiermee het aangemaakte object kunt gebruiken.

Zonder de John variabele kunt u nog steeds een nieuw object maken met de Student class, maar dan is er geen manier om toegang te krijgen tot dit object en het te gebruiken met de verschillende methoden van de klasse.

Methoden gebruiken in JavaScript-klassen

Een methode is een functie van een klasse die wordt gebruikt om bewerkingen uit te voeren op objecten die vanuit de klasse zijn gemaakt. Een goede methode om toe te voegen aan de studentenklas is er een die een rapport genereert over elke student.

Voorbeeld van klassenmethoden maken

Hieronder ziet u een voorbeeld voor het maken van klassenmethoden in JavaScript.

class Student{
constructor(firstName, lastName, startDate){
this.firstName = firstName;
this.lastName = lastName;
this.startDate = startDate;
}
// report method
report(){
return `${this.firstName} ${this.lastName} started attending this institution in ${this.startDate}`
}
}

De klasse hierboven bevat een methode die een rapport genereert over elke student die is gemaakt met de Student klas. Om de . te gebruiken verslag doen van() methode moet je een bestaand object van de klasse gebruiken om een ​​eenvoudige functieaanroep te doen.

Dankzij het voorbeeld van het maken van een object hierboven, zou je een object moeten hebben van de Student klasse die is toegewezen aan de variabele John . Gebruik makend van John , kunt u nu met succes de . bellen verslag doen van() methode.

Voorbeeld van klasmethoden gebruiken

Hieronder ziet u een voorbeeld van het gebruik van klassenmethoden in JavaScript.

//create a new object
const john = new Student('John', 'Brown', '2018');
//calling the report method and storing its result in a variable
let result = john.report();
//printing the result to the console
console.log(result);

De bovenstaande code gebruikt de studenten class om de volgende uitvoer in de console te produceren:

John Brown started attending this institution in 2018

Statische methoden gebruiken in JavaScript-klassen

Statische methoden zijn uniek omdat het de enige methoden in een JavaScript-klasse zijn die zonder object kunnen worden gebruikt.

Uit het bovenstaande voorbeeld kunt u de . niet gebruiken verslag doen van() methode zonder een object van de klasse. Dit komt omdat de verslag doen van() methode is gebaseerd op de attributen van een object om een ​​gewenst resultaat te produceren. Als u echter een statische methode wilt gebruiken, hebt u alleen de naam nodig van de klasse waarin de methode is opgeslagen.

Een voorbeeld van een statische methode maken

Hieronder vindt u een voorbeeld van een statische methode voor JavaScript.

class Student{
constructor(firstName, lastName, startDate){
this.firstName = firstName;
this.lastName = lastName;
this.startDate = startDate;
}
// report method
report(){
return `${this.firstName} ${this.lastName} started attending this institution in ${this.startDate}`
}
//static method
static endDate(startDate){
return startDate + 4;
}
}

Het belangrijkste om op te merken uit het bovenstaande voorbeeld is dat elke statische methode begint met de statisch trefwoord.

Een voorbeeld van een statische methode gebruiken

Hieronder ziet u een voorbeeld voor het gebruik van een statische methode in JavaScript.

//calling a static method and printing its result to the console
console.log(Student.endDate(2018));

De regel code hierboven gebruikt de studenten class om de volgende uitvoer in de console te produceren:

2022

Een JavaScript-klasse maken is eenvoudig

Er zijn verschillende dingen die u moet onthouden als u een JavaScript-klasse wilt maken en er een of meer objecten van wilt instantiëren:

  • Een JavaScript-klasse moet de . hebben klas trefwoord.
  • Een JavaScript-constructor geeft het aantal waarden aan dat een object kan hebben.
  • Algemene klassenmethoden kunnen niet worden gebruikt zonder een object.
  • Statische methoden kunnen zonder object worden gebruikt.

De troosten . log() methode wordt in dit artikel gebruikt om de resultaten te geven van het gebruik van zowel de algemene als de statische methoden in een JavaScript-klasse. Deze methode is een handig hulpmiddel voor elke JavaScript-ontwikkelaar omdat het helpt bij het foutopsporingsproces.

Kennismaken met de console.log() methode is een van de belangrijkste dingen die u als JavaScript-ontwikkelaar kunt doen.

Deel Deel Tweeten E-mail Het ultieme JavaScript-spiekbriefje

Krijg een snelle opfriscursus over JavaScript-elementen met deze spiekbrief.

Lees volgende Gerelateerde onderwerpen
  • Programmeren
  • Programmeren
  • JavaScript
  • Codeertips
  • Codeerhandleidingen
Over de auteur Kadeisha Kean(21 artikelen gepubliceerd)

Kadeisha Kean is een full-stack softwareontwikkelaar en technisch/technologisch schrijver. Ze heeft het onmiskenbare vermogen om enkele van de meest complexe technologische concepten te vereenvoudigen; materiaal produceren dat gemakkelijk kan worden begrepen door elke nieuwe technologie-beginner. Ze is gepassioneerd door schrijven, interessante software ontwikkelen en de wereld rondreizen (via documentaires).

Meer van Kadeisha Kean

Abonneer op onze nieuwsbrief

Word lid van onze nieuwsbrief voor technische tips, recensies, gratis e-boeken en exclusieve deals!

Klik hier om je te abonneren