Lær, hvordan du opretter klasser i JavaScript

Lær, hvordan du opretter klasser i JavaScript

I 2015 blev ES6 -versionen af ​​JavaScript -programmeringssproget frigivet. Denne udgivelse introducerede nogle større opgraderinger til sproget og placerede det officielt i kategorien objektorienteret programmeringssprog blandt andre sprog som Java og C ++.





Objektorienteret programmering fokuserer på objekter og de operationer, der kan udføres på dem. Men før du kan have objekter, skal du have en klasse.



bedste gratis musikafspiller til iphone

JavaScript-klasser er en af ​​de spilændrende funktioner, der fulgte med ES6-versionen af ​​sproget. En klasse kan beskrives som en blueprint, der bruges til at oprette objekter.





I denne selvstudie lærer du, hvordan du opretter og manipulerer objekter ved hjælp af JavaScript -klasser.

JavaScript -klassestruktur

Når du opretter en klasse i JavaScript, er der en grundlæggende komponent, som du altid vil kræve - the klasse nøgleord. Næsten alle andre aspekter af JavaScript -klassen er ikke påkrævet for en vellykket udførelse.



En JavaScript -klasse udføres naturligt, hvis der ikke findes en konstruktør (klassen opretter simpelthen en tom konstruktør under udførelsen). Hvis der imidlertid oprettes en JavaScript -klasse med konstruktører og andre funktioner, men der ikke bruges et klassesøgeord, kan denne klasse ikke eksekveres.

Det klasse søgeord (som altid skal være med små bogstaver) er en nødvendighed i JavaScripts klassestruktur. Følgende eksempel er den generelle syntaks for en JavaScript -klasse. JavaScript -klassen syntaks er nedenfor:



class ClassName{
//class body
}

Oprettelse af en klasse i JavaScript

I programmering kan en klasse ses som en generaliseret enhed, der bruges til at oprette et specialiseret objekt. For eksempel i et skolemiljø kan en generaliseret enhed (en klasse) være elever, og et objekt for elever kan være John Brown. Men før du opretter et objekt, skal du kende de data, det vil gemme, og det er her, JavaScript Constructors spiller ind.

Brug af konstruktører i JavaScript -klasser

En konstruktør er afgørende for klasseoprettelsesprocessen på grund af et par grunde; det initialiserer tilstanden for et objekt (gennem dets attributter), og det kaldes automatisk, når et nyt objekt instantieres (defineres og oprettes).



Brug af et konstruktøreksempel

Nedenfor ser du et konstruktøreksempel med en forklaring på, hvad det betyder.

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

Ovenstående kode præsenterer et vigtigt aspekt af JavaScript -klasse konstruktøren; i modsætning til andre sprog som Java og C ++, bruger en JavaScript -konstruktør ikke klassens navn til at oprette en konstruktør. Den bruger Bygger søgeord, som du kan se i eksemplet ovenfor.

Relaterede: Lær, hvordan du opretter klasser i Java

Det Bygger i eksemplet ovenfor tager tre parametre og bruger det her nøgleord for at tildele parametrene til den aktuelle forekomst af klassen. Det kan virke lidt forvirrende, men hvad du skal forstå er, at en klasse kan ses som en plan, der bruges til at oprette mange huse.

Hvert konstruerede hus kan derefter ses som et objekt i denne klasse. Selvom hvert af disse huse er skabt med den samme plan, kan de skelnes ved deres specifikke geografiske placering eller de mennesker, der ejer dem.

Det det her søgeord bruges til at skelne mellem hvert objekt, der er oprettet af en klasse. Det sikrer, at de korrekte data gemmes og behandles for hvert objekt, der oprettes ved hjælp af den samme klasse.

Oprettelse af et objekt i JavaScript

Konstruktører er vigtige i et sprog som JavaScript, fordi de angiver det antal attributter, et objekt i en bestemt klasse skal have. Nogle sprog kræver, at en attribut (variabel) deklareres, før den kan bruges i en konstruktør eller andre metoder. Dette er imidlertid ikke tilfældet med JavaScript.

Relateret: Sådan erklæres variabler i JavaScript

Når man ser på elevklassens konstruktør ovenfor, kan man se, at et objekt i denne klasse vil have tre attributter.

Oprettelse af et objekteksempel

Nedenfor ser du et eksempel til oprettelse af et objekt i JavaScript.

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

Ovenstående kode bruger Studerende klasse for at oprette et objekt.

Når du opretter et objekt i en klasse, skal du bruge ny nøgleord, efterfulgt af klassens navn og de værdier, du vil tildele de respektive attributter. Nu har du en ny elev med fornavnet John, efternavnet Brown og en startdato for 2018. Du har også en konstant variabel: John. Denne variabel er vigtig, fordi den giver dig mulighed for at bruge det objekt, der er oprettet.

Uden John variabel vil du stadig kunne oprette et nyt objekt ved hjælp af Studerende klasse, men så er der ingen måde at få adgang til dette objekt og bruge det med klassens forskellige metoder.

Brug af metoder i JavaScript -klasser

En metode er en funktion af en klasse, der bruges til at udføre operationer på objekter, der er oprettet fra klassen. En god metode til at føje til elevklassen er en, der genererer en rapport om hver elev.

Oprettelse af klassemetoder Eksempel

Nedenfor er et eksempel til oprettelse af klassemetoder i 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}`
}
}

Klassen ovenfor indeholder en metode, der genererer en rapport om hver elev, der er oprettet med Studerende klasse. At bruge rapport() metode skal du bruge et eksisterende objekt i klassen til at foretage et enkelt funktionsopkald.

Takket være oprette et objekt -eksemplet ovenfor, skal du have et objekt med Studerende klasse, der er tildelt variablen John . Ved brug af John , kan du nu med succes ringe til rapport() metode.

Eksempel på klassemetoder

Nedenfor er et eksempel på brug af klassemetoder i 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);

Ovenstående kode bruger Studerende klasse for at producere følgende output i konsollen:

John Brown started attending this institution in 2018

Brug af statiske metoder i JavaScript -klasser

Statiske metoder er unikke, fordi de er de eneste metoder i en JavaScript -klasse, der kan bruges uden et objekt.

Fra eksemplet ovenfor kan du ikke bruge rapport() metode uden et objekt i klassen. Dette er fordi rapport() metode er afhængig af et objekts attributter for at producere et ønskeligt resultat. For at bruge en statisk metode skal du dog kun bruge navnet på den klasse, der gemmer metoden.

Oprettelse af et eksempel på statisk metode

Nedenfor er et statisk metodeeksempel til 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;
}
}

Det vigtige at bemærke fra eksemplet ovenfor er, at hver statisk metode begynder med statisk nøgleord.

Brug af et eksempel på statisk metode

Nedenfor er et eksempel på brug af en statisk metode i JavaScript.

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

Kodelinjen ovenfor bruger Studerende klasse for at producere følgende output i konsollen:

2022

Det er let at oprette en JavaScript -klasse

Der er flere ting, du skal huske, hvis du vil oprette en JavaScript -klasse og instantiere et eller flere objekter fra den:

  • En JavaScript -klasse skal have klasse nøgleord.
  • En JavaScript -konstruktør angiver antallet af værdier, et objekt kan have.
  • Generelle klassemetoder kan ikke bruges uden et objekt.
  • Statiske metoder kan bruges uden et objekt.

Det konsol . log () metode bruges i hele denne artikel til at give resultaterne af brug af både de generelle og statiske metoder i en JavaScript -klasse. Denne metode er et nyttigt værktøj til enhver JavaScript -udvikler, da den hjælper med fejlfindingsprocessen.

Gør dig bekendt med console.log () metode er en af ​​de vigtigste ting, du kan gøre som JavaScript -udvikler.

Del Del Tweet E -mail Det ultimative JavaScript Cheat Sheet

Få en hurtig opdatering af JavaScript -elementer med dette snydeblad.

Læs Næste Relaterede emner
  • Programmering
  • Programmering
  • JavaScript
  • Kodningstip
  • Kodning Tutorials
Om forfatteren Kadeisha Kean(21 artikler udgivet)

Kadeisha Kean er en softwareudvikler i fuld stak og teknisk/teknologisk forfatter. Hun har den særlige evne til at forenkle nogle af de mest komplekse teknologiske begreber; producerer materiale, der let kan forstås af enhver nybegynder i teknologi. Hun brænder for at skrive, udvikle interessant software og rejse rundt i verden (gennem dokumentarer).

Mere fra Kadeisha Kean

Abonner på vores nyhedsbrev

Tilmeld dig vores nyhedsbrev for at få tekniske tips, anmeldelser, gratis e -bøger og eksklusive tilbud!

Klik her for at abonnere