Înțelegerea constructorilor în JavaScript

JavaScript este un limbaj stabilit, dar a adăugat doar suport pentru programarea orientată pe obiecte (OOP) clasică în ES6. Până când a adăugat caracteristici precum declarațiile de clasă, JavaScript a gestionat OOP folosind o paradigmă bazată pe prototipuri mai puțin cunoscută. Cu oricare dintre abordări, totuși, puteți crea aplicații complexe care utilizează caracteristici bazate pe obiecte.

Un constructor în JavaScript prototip seamănă mult cu orice altă funcție. Principala diferență este că puteți utiliza acea funcție de constructor pentru a crea obiecte.

Ce este un constructor în JavaScript?

Constructorii sunt unul dintre conceptele fundamentale în programarea orientată pe obiecte. Un constructor este o funcție pe care o puteți utiliza pentru a crea o instanță a unui obiect. Pe lângă crearea unui nou obiect, un constructor specifică proprietățile și comportamentele care îi vor aparține.

Sintaxa constructorului

funcţieNameOfConstructor() {
 aceasta.proprietate1 = "Proprietatea 1";
 aceasta.proprietate2 = "Proprietatea 2";
 aceasta.proprietate3 = "Proprietatea 3";
}

Puteți crea un constructor cu funcţie cuvânt cheie, deoarece este în esență ca orice altă funcție. Cu toate acestea, constructorii respectă următoarele convenții:

1. Pentru a le distinge de alte funcții, utilizați un nume pentru constructor care începe cu o literă majusculă.
2. Constructorii folosesc acest cuvânt cheie diferit. În interiorul unui constructor, acest se referă la noul obiect pe care îl va crea constructorul.
3. Spre deosebire de funcțiile JavaScript, constructorii definesc proprietăți și comportamente în loc să returneze valori.

Utilizarea unui constructor pentru a crea obiecte noi

În JavaScript, folosirea unui constructor pentru a crea un obiect este o sarcină ușoară. Iată un constructor simplu cu o invocare după el:

funcţieStudent() {
 acest.nume = "Gloria";
 asta.gen = "Femeie";
acest.varsta = 19;
}
lăsa studentă = nou Student();

În acest exemplu, elevă este un obiect creat din Student constructor. Folosește nou cuvânt cheie pentru a apela funcția ca constructor. Acest cuvânt cheie îi spune JavaScript să creeze o nouă instanță Student. Nu ar trebui să apelați această funcție fără nou cuvânt cheie deoarece acest în interiorul constructorului nu va indica un obiect nou. După construcție, elevă are toate proprietățile de Student. Puteți accesa și modifica aceste proprietăți la fel cum ați face cu orice alt obiect.

Lucruri importante de știut despre constructorii JavaScript

Lucrul cu constructori poate fi atât de obositor și, în același timp, poate fi o sarcină ușoară. Iată câteva lucruri importante pe care orice dezvoltator ar trebui să le cunoască despre lucrul cu constructori.

Utilizarea constructorilor cu argumente

Puteți extinde un constructor pentru a primi argumente. Acest lucru este foarte important dacă doriți să scrieți cod receptiv și flexibil.

Ori de câte ori creați un obiect dintr-un constructor, obiectul va moșteni toate proprietățile declarate în constructor. De exemplu, cel elevă pe care le-ați creat mai sus vor avea proprietăți Nume, gen, și vârstă cu valori inițiale fixe. Deși puteți modifica manual fiecare proprietate, ar fi mult de lucru dacă ați scrie un program folosind multe obiecte.

Din fericire, constructorii JavaScript pot accepta parametri, ca orice altă funcție. Puteți schimba Student constructorul să accepte doi parametri:

funcţieStudent(nume, sex) {
acest.nume = nume;
acest.gen = gen;
acest.varsta = 19;
}

Acum puteți defini obiecte unice din același constructor prin introducerea unor argumente diferite.

Argumentele fac constructorii mai flexibili. Ele economisesc timp și încurajează codul curat.

Definirea metodelor obiectului

O metodă este o proprietate a obiectului care este o funcție. Metodele vă îmbunătățesc codul în POO, deoarece adaugă diferite comportamente obiectelor dvs. Iată un exemplu:

funcţieStudent(nume, sex) {
acest.nume = nume;
acest.gen = gen;
acest.varsta = 19 ;
acest.spuneNume = funcţie () {
întoarcere„Numele meu este ${name}`; 
 }
}

Cele de mai sus adaugă funcția spune Nume către constructor.

Să presupunem că utilizați acest constructor pentru a crea un obiect pe care îl stocați într-o variabilă, elevă. Apoi puteți apela această funcție cu codul de mai jos:

elevă.spune Nume()

Prototipul

Mai devreme, noi am creat Student într-un mod în care toate instanţele sale vor avea o vârstă proprietate cu o valoare de 19. Acest lucru va avea ca rezultat o variabilă duplicată pentru fiecare Student instanță pe care o creați.

Pentru a evita această dublare, JavaScript folosește conceptul de prototipuri. Toate obiectele create dintr-un constructor împărtășesc proprietățile prototipului său. Puteți adăuga vârstă proprietate la Student prototip după cum se arată mai jos:

Student.prototype.varsta = 19;

Făcând acest lucru, toate cazurile de Student va avea vârstă proprietate. Declararea proprietățile prototipului este o modalitate de a reduce codul duplicat în aplicația dvs. Îți face codul cât mai standard posibil.

O proprietate prototip poate fi un obiect

Puteți adăuga proprietăți Prototype individual, așa cum este explicat mai sus. Dar dacă aveți multe proprietăți de adăugat, acest lucru poate fi incomod.

Ca alternativă, puteți conține toate proprietățile de care aveți nevoie într-un obiect nou. Făcând acest lucru, veți seta toate proprietățile simultan. De exemplu:

Student.prototype = {
 varsta: 19,
 rasă: "alb",
 handicap: "Nici unul"
}

Student.prototype = { 
constructor: Student, 
 varsta: 19, 
 rasă: "alb", 
 handicap: "Nici unul"
}

Supertipuri și moștenire

Moştenire este o metodă pe care programatorii o folosesc pentru a reduce erorile în aplicațiile lor. Este un mod de a rămâne la Nu te repeta (USCAT) principiu.

Să presupunem că aveți doi constructori—Student și Profesor— care au două proprietăți prototip similare.

Student.prototype = { 
constructor: Student,
spuneNume: funcţie () {
întoarcere„Numele meu este ${name}`; 
 }
}
Teacher.prototype = { 
constructor: Profesor,
spuneNume: funcţie () {
întoarcere„Numele meu este ${name}`;
 }
}

Ambii acești constructori definesc spune Nume metoda, identic. Pentru a evita această dublare inutilă, puteți crea un supertip.

funcţieDetalii individuale(){};
IndividualDetails.prototype = { 
constructor: Detalii individuale, 
spuneNume: funcţie () {
întoarcere„Numele meu este ${name}`; 
 }
};

Apoi puteți elimina spune Nume de la ambii constructori.

Pentru a moșteni proprietățile de la supertip, utilizați Object.create(). Setați prototipul ambilor constructori la o instanță a supertipului. În acest caz, setăm Student și Profesor prototipuri la o instanță de IndividualDetails.

Aici este:

Student.prototip = Obiect.creare (IndividualDetails.prototype);
Profesor.prototip = Obiect.creare (IndividualDetails.prototype);

Făcând asta, Student și Profesor moștenește toate proprietățile supertipului, Detalii individuale.

Iată cum să exersați DRY în OOP folosind supertipuri.

Constructorii sunt schimbatori de joc

Constructorii sunt o componentă cheie a JavaScript, iar stăpânirea funcționalității lor este crucială pentru dezvoltarea aplicațiilor JavaScript OOP. Puteți folosi un constructor pentru a crea obiecte care împărtășesc proprietăți și metode. De asemenea, puteți utiliza moștenirea pentru a defini ierarhii de obiecte.

În ES6, puteți utiliza clasă cuvânt cheie pentru a defini clasele clasice orientate pe obiecte. Această versiune de JavaScript acceptă și a constructor cuvânt cheie.