Ereditarietà di classe in JavaScript

Ereditarietà di classe In JavaScript è una caratteristica preziosa che consente la riutilizzabilità del codice. Utilizzando l'eredità della classe, la classe figlio avrà tutti gli accesso alle proprietà e ai metodi della classe genitore in un programma JavaScript. Ti consente inoltre di creare una classe figlio che eredita la funzionalità della classe genitore consentendo al contempo di sovrascriverla.

Questo articolo discuterà dell'eredità di classe in JavaScript. Spiegheremo anche Metodi di ombreggiatura E ereditando metodi statici Usando l'eredità di classe in JavaScript. Inoltre, ciascuna delle sezioni specificate sarà dimostrata con l'aiuto di esempi. Quindi iniziamo!

Ereditarietà di classe in JavaScript

Il meccanismo in cui una classe eredita i metodi e le proprietà di un'altra classe è noto come Ereditarietà di classe. IL "Base" o il "Genitore"La classe è quella i cui metodi e proprietà sono ereditati, mentre il"Derivato" o il "Bambino"La classe eredita la funzionalità della classe genitore:

IL "si estende"La parola chiave viene utilizzata per stabilire l'eredità della classe tra la classe genitore e figlio e"super"La parola chiave viene utilizzata per accedere ai metodi e alle proprietà della classe genitore.

Esempio: eredità di classe in JavaScript

Nell'esempio seguente, definiremo due classi: Persona E Dipendente, e creare l'eredità di classe tra di loro utilizzando il "super" E "si estende"Parole chiave.

Prima di tutto, definiremo un genitore o una classe base denominata "Persona"Avere un costruttore e un metodo mostrato ():

persona di classe
costruttore (nome)
Questo.nome = nome;

mostrato ()
console.log ('il mio nome è' + questo.nome);

Nel prossimo passaggio, creeremo la classe figlio denominata "Dipendente"Che avrà un costruttore e un"DisplayStatus ()" metodo. Stabilire una relazione di eredità di classe con il "Persona"Classe, devi usare il"si estende"Parola chiave e specifica il nome della classe principale, che è"Persona" nel nostro caso. Dopo averlo fatto, il "Dipendente"La classe erediterà il"Persona"Metodi e proprietà della classe.

Inoltre, nel "Dipendente"Classe costruttore, invoceremo"super()"Per chiamare il costruttore del"Persona"Classe mentre passa il"nome" discussione:

Il dipendente di classe estende la persona
costruttore (nome)
super (nome);

DisplayStatus ()
console.log ('I AM A DEMPIEREE');

Ora creeremo un "dipendente”Oggetto del"Dipendente"Classe e passerà"Jack"Come argomenti di nome nel costruttore:

let dipendente = nuovo dipendente ('jack');

Il creato "dipendente"L'oggetto ha ereditato tutti i metodi e la proprietà del"Persona" classe. Ora invoceremo il "mostrato ()Metodo del "Persona"Classe con esso:

dipendente.mostrato ();

Infine, chiameremo "DisplayStatus ()Metodo del "Dipendente"Oggetto di classe:

dipendente.DisplayStatus ();

Dai un'occhiata all'immagine di seguito donata del codice fornito e al suo output:

Come super () inizializza il "Questo"Oggetto, devi invocarlo prima di accedervi. Tuttavia, se provi ad accedere "Questo"Prima di eseguire Super (), ti darà un errore.

Ad esempio, per inizializzare il "età"Proprietà del"Dipendente"Classe nel suo costruttore, chiameremo"super()"Prima e poi accedi al"Questo"Oggetto:

Il dipendente di classe estende la persona
costruttore (nome, età)
super (nome);
Questo.età = età;

Schermo()
console.log ("Sono un dipendente");

getAge ()
Restituisci questo.età;

Ora, al momento della creazione del "dipendente1”Oggetto del"Dipendente"Classe, passeremo"Jack" COME nome E "29" COME età Argomento al costruttore:

Let Employee1 = new Employee ('Jack', 29);

Quindi, dopo l'inizializzazione, invoceremo il "getAge ()"Metodo della nostra classe di dipendenti per visualizzare il valore della proprietà dell'età:

console.registro (dipendente1.getAge ());

Dai un'occhiata all'output dell'esempio sopra offerto:

Metodi di ombreggiatura usando l'eredità di classe in JavaScript

I metodi con lo stesso nome possono essere definiti nelle classi genitore e figlio. In tale situazione, quando invochi il metodo di un oggetto di classe figlio, oscurerà il metodo presente nella classe genitore.

Ad esempio, il sottoto "Alunno"La classe è la classe figlio del"Persona"E sta ridefinendo il"mostrato ()" metodo:

Lo studente di classe estende la persona
costructor ()
super ('jack');

mostrato ()
console.log ('il mio nome è jack');

Ora il "mostrato ()"Il metodo esiste nella classe figlio e anche nella classe genitore. Quindi, quando chiami "mostrato ()" con il "Alunno"Oggetto di classe, invocherà il metodo mostrato () definito nella classe figlio:

Let Student1 = new Student ();
Studente1.mostrato ();

Ecco il codice di esempio con il suo output:

Se vuoi invocare il metodo della classe principale con lo stesso nome, nella classe figlio, devi scrivere "super.MethodName (argomenti)". Ad esempio, chiameremo "mostrato ()Metodo del "Persona"Classe (genitore) aggiungendo la riga"super.mostrato ()"Nella nostra classe figlio mostrato () metodo:

mostrato ()
super.mostrato ();
console.log ("funzione figlio");

Ora, quando l'oggetto della classe figlio invoca il "mostrato ()", Passerà attraverso il corpo del metodo della classe figlio mostrato (), quindi chiamerà il metodo della classe genitore mostrato (). Dopo aver completato l'esecuzione del metodo della classe principale mostrato (), il controllo verrà riportato al metodo mostrato () della classe figlio:

Let Student1 = new Student ();
Studente1.mostrato ();

Nella seguente immagine, puoi vedere l'output di "mostrato ()" metodo:

Ereditando membri statici usando l'eredità di classe in JavaScript

La classe figlio può anche ereditare i metodi e le proprietà statici della classe genitore. Lascia che ti aiutiamo a capire questo concetto dimostrando un esempio.

Nel seguente esempio, definiremo un statico "Ciao mondo()"Metodo nello stesso"Persona"Classe principale che emetterà semplicemente il"Ciao mondo"Stringa chiamandolo:

persona di classe
costruttore (nome)
Questo.nome = nome;

mostrato ()
console.log ('il mio nome è' + questo.nome);

statico helloworld ()
console.log ('Hello World');

Nel prossimo passaggio, creeremo "Dipendente"Come una classe bambino del"Persona", Quindi può ereditare il metodo e le proprietà della classe genitore, incluso il"Ciao mondo()"Metodo statico:

Il dipendente di classe estende la persona
DisplayStatus ()
console.log ('I AM A DEMPIEREE');

Successivamente, invocheremo il metodo statico di Helloworld () attraverso il "Dipendente" classe:

Dipendente.Ciao mondo();

Il dipendente.Il metodo Helloworld () verrà eseguito come la persona.Metodo HelloWorld ():

Conclusione:

Puoi usare il si estende Parola chiave per la creazione di un'eredità di classe in JavaScript e nel super Parola chiave per fare riferimento alla classe genitore. Con il meccanismo di eredità della classe in JavaScript, la classe figlio può accedere ai metodi e alle proprietà della classe madre. Questo articolo ha discusso dell'eredità di classe in JavaScript. Abbiamo anche spiegato i metodi di ombreggiatura e ereditando metodi statici usando l'eredità di classe in JavaScript. Inoltre, ciascuna delle sezioni specificate è dimostrata con l'aiuto di esempi.