OOP -klasser i JavaScript | Forklart

Før ES6, “prototyper”Ble brukt til å simulere klasser i JavaScript, der ytterligere egenskaper kan assosieres med en prototype ved bruk av arv. Når en ny og forbedret versjon av ES5 ble introdusert, kjent som ES6, JavaScript -klasser ble lagt til det.

I ES6 regnes klasser som en grunnleggende komponent i JavaScript, og det har mye enklere og feilutsatt Syntaks sammenlignet med prototyper. I likhet med objektorientert programmering (OOP), omfatter JavaScript-klassen en konstruktørmetode, noen spesifikke egenskaper, metoder og objekter av den gitte klassetypen.

Dette innlegget forklarer OOP -klasser i JavaScript ved hjelp av passende eksempler. Så la oss starte!

OOP -klasser i JavaScript

Som nevnt tidligere blir JavaScript -klasser introdusert i ES6. De tilbyr en kortfattet måte å erklære klasse ved å bruke en syntaks som ligner på det vi bruker i OOP.

I JavaScript kan du bruke "klasse”Nøkkelord for å definere en klasse. Det tilfører syntaktisk sukker (en god type sukker) over det eksisterende prototypen arvemønster.

Syntaks av OOP -klasser i JavaScript

For å lage en OOP-klasse i JavaScript, må du følge den undergitte syntaks:

Klasseklassenavn
konstruktør () …

Her, “klasse”Er et nøkkelord som brukes til å lage en klasse. En OOP -klasse må også ha en metode som heter “konstruktør ()”.

Eksempel: Lag OOP -klasse i JavaScript

Vi vil definere en klasse som heter “Person”Som har to egenskaper:“Navn”Og“alder”:

klasseperson
konstruktør ()
dette.Navn = 'Alex';
dette.alder = 25;

For å bruke personklassen, må vi lage en gjenstand eller forekomst av den spesifiserte klassen:

La person1 = ny person ();

Nå, “Person1”Objekt kan få tilgang til egenskapene til“Person”Klasse:

konsoll.Logg (Person1.Navn + "" + Person1.alder);

Som nevnt tidligere, må en OOP -klasse i JavaScript inneholde en konstruktør. Vil du vite mer om konstruktører i JavaScript? Hvis ja, så følg den undergitte delen.

Konstruktører for OOP -klasser i JavaScript

Konstruktør er en metode påkalt når du oppretter en forekomst av en OOP -klasse. Det brukes også til å initialisere objekter i en klasse. Imidlertid vil JavaScript automatisk opprette og utføre en tom konstruktør hvis du ikke har definert noen konstruktørmetode for en OOP -klasse.

Typer konstruktører for OOP -klasser i JavaScript

I JavaScript er det følgende to typer konstruktører:

• Standard konstruktør
• Parameterisert konstruktør

Den neste delen vil kort forklare standard og parameterisert konstruktør og deres bruk i JavaScript.

Standard konstruktør for OOP -klasser i JavaScript

Du kan også eksplisitt definere en standardkonstruktør uten argumenter hvis du vil utføre noen spesifikk operasjon mens du oppretter et OOP -klasseobjekt.

Syntaks for standardkonstruktør i JavaScript

Klasseklassenavn
konstruktør ()
// kropp av standardkonstruktøren

Eksempel: Standardkonstruktør for OOP -klasser i JavaScript

I det undergitte eksemplet vil vi definere en standardkonstruktør for "Person”Klasse. I henhold til definisjonen av "konstruktør ()”Metode, når en“Person”Klasseobjekt opprettes, det vil initialisere dets“Navn”Eiendom til“Alex”, Og“alder”Eiendom som“25.”

klasseperson
konstruktør ()
dette.Navn = 'Alex';
dette.alder = 25;


const Person1 = ny person ();
konsoll.Logg ("Navn:" + Person1.Navn);
konsoll.Logg ("Alder:" + Person1.alder);

Utførelse av det gitte programmet vil lage et “Person1”Objekt av“Person”OOP -klasse ved å bruke standardkonstruktøren. Standardkonstruktøren vil deretter initialisere de spesifiserte egenskapene for “Person1”Objekt. Til slutt "konsoll.Logg()”Metoden vil skrive ut verdiene som er lagret i“Person1.Navn”Og“Person1.alder" egenskaper:

I en OOP -klasse er det nyttig å bruke standardkonstruktøren når du vil initialisere egenskapene til alle de opprettede objektene med samme verdi. Men hva om du trenger å tilordne noen unike verdier til objektet mens du oppretter det? I JavaScript kan du oppnå denne funksjonaliteten ved hjelp av "Parameterisert konstruktør”.

Parameterisert konstruktør for OOP -klasser i JavaScript

En konstruktør som omfatter parametere er kjent som “Parameterisert konstruktør“. Denne typen konstruktør brukes hovedsakelig når du vil initialisere egenskapene til JavaScript OOP -klassen med noen spesifikke verdier.

Syntaks av parameterisert konstruktør i JavaScript

Klasseklassenavn
konstruktør (parameter1, parameter2 ..., parametern)
// kropp av den parameteriserte konstruktøren

Den parameteriserte konstruktøren aksepterer parametere som er bestått som “argumenter”Mens du oppretter et OOP -klasseobjekt.

Eksempel: Parameterisert konstruktør for OOP -klasser i JavaScript

Vi vil lage en parameterisert konstruktør for “Person”Klasse som initialiserer egenskapene med verdiene som er gitt som argumenter:

klasseperson
konstruktør (navn, alder)
dette.Navn = navn;
dette.alder = alder;

I den undergitte koden, "Person1”Objekt av“Person”Klasse vil bli opprettet ved hjelp av parameterisert konstruktør der“Maks”Blir passert som“Navn”Eiendomsverdi, og“25”Argument representerer verdien av“alder”Eiendom:

const person1 = ny person ("maks", 25);
konsoll.Logg ("Navn:" + Person1.Navn);
konsoll.Logg ("Alder:" + Person1.alder);

Å følge utgangen betyr at vi har laget en "Person1”Objekt som har de spesifiserte eiendomsverdiene ved hjelp av den parameteriserte konstruktøren:

Vi har snakket om å lage OOP -klasser, deres relaterte objekter og definere standard og parameteriserte konstruktører. Nå vil vi gå videre og diskutere en annen kritisk komponent i en OOP -klasse som er "Metode”.

Metoder i OOP -klasser i JavaScript

Metoder er en type funksjon assosiert med spesifikke JavaScript OOP -klasser. De fungerer også som en medlemsfunksjon når de er definert i en klasse og kan brukes til å få tilgang til egenskapene til klassen.

Syntaks av metoder for OOP -klasser i JavaScript

Klasseklassenavn
MethodName
// Body of the MethodName

Merk: Navnet på en OOP -klassemetode må være i små bokstaver.

Eksempel: Metoder i OOP -klasser i JavaScript

I den samme "Person”Klasse, vi vil definere en“displayInfo ()”Metode som returnerer verdiene til“Navn”Og“alder”Egenskaper for et spesifisert objekt:

displayInfo ()
Return ("Navn:" + dette.Navn + "Alder:" + Dette.alder);

Etter å ha gjort det, vil vi lage et objekt av "Person”Klasse:

const person1 = ny person ("maks", 25);

Deretter vil vi påkalle "displayInfo ()”Ved å bruke“Person1”Objekt:

Person1.displayInfo ();

“displayInfo ()”Metoden vil returnere“Navn”Og“alder”Verdier av“Person1”Objekt:

Vi har samlet den essensielle informasjonen relatert til OOP -klassen i JavaScript.

Konklusjon

Bruker "klasse”Søkeord, kan du definere en OOP -klasse I JavaScript. I ES6 ble JavaScript -klassene introdusert for å tilsette syntaktisk sukker (en god type sukker) over det eksisterende prototypens arvemønster. I likhet med OOP omfatter JavaScript -klassen en konstruktørmetode, noen spesifikke egenskaper, metoder og objekter av den gitte klassetypen. Denne oppskrivningen forklarte OOP -klasser i JavaScript ved hjelp av passende eksempler.