JavaScript s-a dezvoltat considerabil de-a lungul anilor. În special, odată cu introducerea ES6, programarea cu clase a devenit considerabil mai ușoară. Metoda veche de creare a claselor prin prototipuri și funcții constructor era adesea complicată și predispusă la erori. În acest tutorial, vei învăța cum să folosești eficient noua sintaxă class și care sunt diferențele dintre vechea și noua formă de scriere. De asemenea, vei învăța cum să îți extinzi structura de clase prin moștenire.
Principalele concluzii
- Noua sintaxă class permite o formă de definiție mai clară și mai compactă.
- Utilizarea constructorilor este mai simplă și nu necesită prototipuri separate.
- Funcționalitatea din spatele sintaxei class rămâne bazată pe prototipuri.
Ghid pas cu pas
1. Înțelegerea vechii forme de scriere
Pentru a recunoaște avantajele noii sintaxe de clase, să ne uităm mai întâi la vechea metodă. Aici se creează o funcție constructor, iar metodele sunt adăugate prin prototip.
Atunci când dorești să creezi un nou obiect, se face cu new Shape(1, 100, 200). Apoi, obiectul shape poate fi utilizat pentru a obține proprietățile.
2. Afișarea valorilor
Pentru a ne asigura că instanța noastră de obiect funcționează corect, vom afișa proprietățile x și y.
3. Introducerea noii sintaxe class
Acum trecem la noua sintaxă class, disponibilă începând cu ES6.
Schimbările sunt evidente: nu mai ai nevoie de un prototip separat. În schimb, definești toate metodele în cadrul clasei.
4. Crearea obiectelor cu noua clasă
Crearea unui obiect cu noua sintaxă se face la fel ca înainte. Folosești new pentru a crea o instanță a clasei Shape.
5. Utilizarea noii clase
Utilizarea clasei nou definite este identică metodei vechi. Poți folosi instanța shape1 pentru a obține valorile și pentru a utiliza metoda move.
6. Moștenirea în clase
Un alt avantaj al sintaxei class este posibilitatea de moștenire. Dacă dorești să creezi o nouă clasă care să moștenească de la o clasă existentă, poți folosi cuvântul cheie extends.
Aici, constructorul clasei copil super() apelează constructorul clasei părinte. Acest lucru îți permite să folosești proprietățile lui Shape și, în același timp, să definești proprietăți unice pentru Rectangle.
7. Concluzie privind declarația class
Sintaxa class face ca baza ta de cod să fie nu doar mai clară, ci permite și o structurare mai clară atunci când lucrezi cu concepte orientate pe obiect. Nu doar că poți crea clase, dar poți construi și ierarhii de moștenire complexe, ceea ce face codul tău mai flexibil și mai ușor de întreținut.
Rezumat – Noua sintaxă de clase în JavaScript: ES6 până la ES13
În acest tutorial, ai învățat cum să folosești noua sintaxă class în JavaScript de la ES6 până la ES13 în mod eficient. Metoda veche de formare a claselor era adesea anevoioasă și predispusă la erori, în timp ce noua sintaxă permite o structură clară și simplă. De asemenea, ai învățat noțiunile de bază ale moștenirii prin sintaxa extends, pentru a-ți extinde și mai mult clasele.
Întrebări frecvente
Care este diferența dintre vechea și noua sintaxă de clase?Metoda veche folosește funcții constructor și prototipuri, în timp ce noua sintaxă simplifică definirea și utilizarea claselor.
De ce ar trebui să folosesc noua sintaxă class?Oferă o modalitate mai clară, mai compactă și mai intuitivă de a defini clase, ceea ce îmbunătățește mentenanța și lizibilitatea codului.
Cum funcționează moștenirea cu sintaxa class?Clasa ta poate prelua funcționalitățile unei alte clase prin cuvântul cheie extends, apelând constructorul clasei părinte cu super().
