Getters and Setters in JavaScript

Mosh Hamedani

Follow

29 decembrie, 2019 – 5 min citește

.

Conceptul de getters și setters este destul de comun printre limbajele populare utilizate în prezent. Ați avut vreodată nevoie să vă asigurați că o anumită acțiune este întotdeauna efectuată înainte sau după atribuirea unei anumite valori la o proprietate a unui obiect? Acest lucru este posibil cu ajutorul setorilor. De asemenea, puteți efectua orice fel de procesare atunci când recuperați valoarea unei proprietăți utilizând getteri (de exemplu, formatarea). O modalitate de implementare a getterilor și setterilor este utilizarea metodelor, așa cum se face în Java. Cu toate acestea, începând cu ES5, avem la dispoziție o alternativă mult mai elegantă și mai practică prin utilizarea sintaxelor get și set. Ei bine, haideți să începem!

În JavaScript, obiectele sunt colecții de proprietăți și probabil că le-ați mai folosit pentru a stoca date. O proprietate este pur și simplu o pereche cheie-valoare. Iată un exemplu:

const options = {
timeout: 5000,
retries: 3,
ip: '192.168.1.20',
port: 4001,
};

Proprietățile dintr-un obiect pot fi ușor setate și citite, astfel:

artist.name = 'Carice Anouk van Houten';console.log(artist.name); //=> "Carice Anouk van Houten"

Din nou, acest lucru nu este cu siguranță nimic nou dacă aveți deja o anumită experiență cu JavaScript. Pentru a face o distincție între aceste proprietăți obișnuite și celălalt tip pe care îl vom vedea în acest articol, le putem numi pe cele dintâi „proprietăți de date”.

Getters și setters: metoda veche

Înainte de ES5, singurul mod în care trebuia să implementăm getters și setters era prin utilizarea metodelor obișnuite. Ca în exemplul de mai jos:

Am păstrat cuvântul cheie function în exemplul de mai sus pentru a clarifica faptul că nu există magie aici. Doar metode normale. Am fi putut obține același efect folosind sintaxa de definire a metodelor din ES2015, care este mai scurtă și ceva mai elegantă:

const config = {
_port: 4001,
setPort(port) {
// ...
},
getPort() {
// ...
},
};

Utilizarea acestor tipuri de getters și setters este destul de simplă:

config.setPort(8080);
console.log(config.getPort()); //=> 8080

Incrementul unei valori s-ar face în felul următor:

item.setQuantity(item.getQuantity() + 1);

Ceea ce pare foarte stufos în comparație cu incrementarea directă a unei proprietăți:

item.quantity += 1;
// Or even simpler...
item.quantity++;

Getteri și setteri: de ce?

În limbajele OO, cum ar fi Java, C++ sau C#, este posibil să se expună membrii unei clase la diferite niveluri prin utilizarea modificatorilor de acces (cum ar fi public, protected și private). Acest lucru servește la implementarea unui concept important al POO numit ascunderea datelor.

O utilizare foarte comună a getterilor și setterilor în aceste limbaje este de a expune membrii unei clase într-un mod sigur. De exemplu, ați putea implementa doar un getter pentru a vă asigura că un membru privat nu va fi niciodată modificat din afara clasei. Un setter, la rândul său, poate fi folosit pentru a valida valorile furnizate și pentru a păstra integritatea instanțelor acelei clase.

Cum rămâne cu JavaScript?

În JavaScript, lucrurile sunt puțin diferite. Până la momentul scrierii acestui articol, nu există modificatori de acces în JS. În prezent, cea mai bună opțiune pe care o avem este să folosim simboluri, care ne oferă un anumit nivel de confidențialitate atunci când sunt folosite ca chei. Totuși, unora nu le plac. Mai ales pentru că este ușor de încălcat această confidențialitate prin utilizarea reflecției.

Nu consider că aceasta este o problemă reală, deoarece limbajele care au reflecție permit de obicei programatorilor să încalce încapsularea într-un fel sau altul. Problema pe care o văd la simboluri este că acestea nu sunt atât de practice de utilizat cum ar fi un simplu accesor privat. Vestea bună este că o propunere EcmaScript care include câmpuri private este deja în etapa 3. Iar acestea vor fi imune la orice fel de reflecție.

În exemplul din secțiunea anterioară, nu am folosit simboluri sau orice alt truc pentru a simula un membru privat. Proprietatea _port nu are nimic special în sine. Este doar o proprietate de date obișnuită și, ca atare, poate fi setată sau citită direct, ocolind complet getterul și setterul pe care le-am creat.

Din moment ce explicarea simbolurilor și a altor tehnici de încapsulare nu este scopul acestui articol, nu implementez proprietăți private în exemplele sale de cod. Rețineți doar că getters și setters sunt utilizate în mod obișnuit (dar nu întotdeauna) pentru a oferi acces la membrii încapsulați. În cele din urmă, observați sublinierea care precede numele proprietății _port. Este o convenție de facto printre dezvoltatorii JS, care indică faptul că o anumită proprietate este privată și nu ar trebui să fie accesată din afara clasei în care este definită.

Getters și setteri: noua modalitate cu proprietățile accesor

Proprietățile accesor sunt modalitatea modernă de definire a getterilor și setterilor. Când vine vorba de definiția lor, ele nu sunt atât de diferite de exemplul nostru anterior, dar utilizarea lor este cu adevărat diferită. În primul rând, haideți să adaptăm codul nostru pentru a utiliza proprietățile accesor:

După cum puteți vedea, doar două lucruri s-au schimbat în acest exemplu:

  • În loc să avem metodele setPort și getPort. Folosim sintaxa set și get împreună cu un singur nume pentru proprietate („port„, în acest exemplu)
  • Nu avem nevoie de cuvântul cheie function aici. De fapt, dacă încercați să îl folosiți, veți primi o eroare de sintaxă.

Cum să folosim proprietățile accesor?

Dacă definiția unei proprietăți accesor este destul de asemănătoare cu modul în care creăm getters și setters din vechea școală, utilizarea lor nu are nicio diferență vizibilă față de modul în care folosim proprietățile de date obișnuite:

config.port = 8080;
console.log(config.port); //=> 8080

Și iată cum arată o expresie de incrementare:

timer.seconds += 1;

Da. Este atât de simplu. =)

Concluzie

  • Obiectele sunt colecții de proprietăți
  • O proprietate obișnuită este doar o pereche cheie-valoare și poate fi numită o „proprietate de date”
  • Puteți implementa getteri și setori ca metode normale. Acesta este modul „old school” de a face acest lucru în JavaScript.
  • Getterii și setterii sunt în mod normal folosiți pentru a oferi acces la membrii privați ai unei clase.
  • Proprietățile accesor se pot comporta exact ca getteri și setteri bazați pe metode obișnuite vechi, dar utilizarea lor este concepută pentru a le face să arate ca proprietăți de date.

Vreți să stăpâniți JavaScript? Vă recomand cu căldură cursurile de JavaScript ale lui Mosh.

Și dacă v-a plăcut acest articol, distribuiți-l și altora!

.

Lasă un răspuns

Adresa ta de email nu va fi publicată.