10 convenții esențiale de denumire JavaScript pe care fiecare dezvoltator ar trebui să le cunoască

Este esențial să mențineți simplitatea, lizibilitatea și ușurința de întreținere în codul dvs. pentru a gestiona proiecte JavaScript complexe. Aderarea în mod constant la convențiile de numire este cheia atingerii acestui obiectiv.

Variabilele, booleanele, funcțiile, constantele, clasele, componentele, metodele, funcțiile private, variabilele globale și fișierele se numără printre elementele JavaScript care necesită convenții de denumire consistente. Puteți îmbunătăți organizarea și înțelegerea codului prin implementarea convențiilor de denumire standardizate în toate aceste componente, economisind timp și efort pe termen lung.

1. Numirea variabilelor

În JavaScript, datele sunt stocate în variabile. Este esențial să alegeți nume descriptive pentru variabile care reflectă cu exactitate funcția lor. Ai putea, de exemplu, să înlocuiești nume de utilizator sau pretul total pentru numele unei variabile mai degrabă decât X.

O modalitate bună de a numi variabilele este următoarea:

lăsa totalPrice = 100;
lăsa userName = "Ioan";

Lizibilitatea codului îmbunătățită poate fi obținută prin utilizarea numelor de variabile descriptive

2. Denumirea booleană

Variabile care pot avea doar două valori, adică oricare Adevărat sau fals, sunt cunoscute ca boolean. Este esențial să alegeți nume adecvate pentru variabilele booleene care își exprimă scopul.

Pentru a ilustra, în loc să optați pentru un nume de variabilă, cum ar fi este adevarat, ar trebui să preferați să mergeți cu este valabil sau areValoare.

Luați în considerare acest exemplu:

lăsa isValid = Adevărat;
lăsa areValoare = fals;

În acest exemplu, numele de variabile booleene descriptive clarifică ceea ce reprezintă.

3. Funcții de denumire

O funcție în JavaScript se referă la o unitate de cod autonomă care este destinată îndeplinirii unei anumite sarcini. Este un bloc de cod care poate fi apelat sau invocat de alte părți ale codului și funcționează ca o entitate independentă.

Pentru a denumi în mod eficient funcțiile, utilizați nume descriptive care să le transmită scopul. De exemplu, în loc de crearea unei funcțiifoo, optează pentru nume mai ilustrative precum validateUserInput sau calculateTotalPrice.

De exemplu:

funcţiecalculateTotalPrice(pret, cantitate) {
întoarcere pret * cantitate;
}
funcţievalidateUserInput(intrare) {
întoarcere intrare !== nedefinit && intrare !== nul;
}

4. Denumirea constantelor

Constantele sunt variabile care nu pot fi reatribuite. La denumirea constantelor, este important să folosiți toate literele mari și liniuțele de subliniere pentru a separa cuvintele.

De exemplu:

const MAX_PRICE = 1000;
const MIN_PRICE = 0;

În acest exemplu, toate literele mari și liniuțele de subliniere au fost folosite pentru a separa cuvintele din numele constante.

5. Clasele de denumire

În JavaScript, obiectele pot fi create folosind planuri numite clase. Pentru a realiza practici de denumire imaculate, este de cea mai mare importanță să executați PascalCase, o convenție de denumire care impune scrierea cu majuscule a primei litere a fiecărui cuvânt.

Luați, de exemplu:

clasăCărucior de cumpărături{
constructor(fa model) {
acest.make = face;
acest.model = model;
 }
}

În acest exemplu, clasa Cărucior de cumpărături a fost denumit folosind PascalCase, ceea ce înseamnă că prima literă a fiecărui cuvânt din numele clasei a fost scrisă cu majuscule și nu există spații sau liniuțe de subliniere între cuvinte.

6. Denumirea componentelor

Componentele sunt componente esențiale în dezvoltarea software-ului modern, în special în cadre precum React, care accentuează codul reutilizabil.

Prin descompunerea unei interfețe de utilizator sau a unei aplicații complexe în bucăți mai mici, ușor de gestionat, puteți crea componente care pot fi reutilizate în diferite proiecte, reducând timpul de dezvoltare și crescând codul eficienţă.

Din nou, vă recomandăm să utilizați convenția de denumire PascalCase pentru denumirea componentelor. Aceasta înseamnă scrierea cu majuscule a primei litere a fiecărui cuvânt din numele componentei.

O astfel de convenție vă ajută să distingeți componentele de alte segmente de cod, simplificând identificarea și manipularea.

funcţieButon(recuzită) {
întoarcere<buton>{props.label}buton>;
}

În acest exemplu, convenția de denumire PascalCase a fost folosită pentru a denumi componenta Buton.

7. Metode de denumire

La denumirea metodelor, este esențial să folosiți nume descriptive care să comunice cu succes ceea ce metoda realizează, deoarece metodele sunt funcții care aparțin unui obiect.

De exemplu:

clasăMașină{
constructor(fa model) {
acest.make = face;
acest.model = model;
 }
 Pornirea motorului() {
// cod pentru a porni motorul 
 } 
 stopEngine() { 
// cod pentru a opri motorul 
 }
 }
}

Nume descriptive (Pornirea motorului, opriMotorul) sunt utilizate pentru metodele din acest exemplu, asigurându-se că scopul propus este ușor de înțeles.

8. Denumirea funcțiilor private

Funcțiile definite ca private sunt restricționate la acces numai în cadrul obiectului în care sunt definite. Este esențial să adăugați un caracter de subliniere (_) pentru a indica faptul că funcțiile sunt private.

Iată un exemplu:

clasăMașină{
constructor(fa model) {
acest.make = face;
acest.model = model;
 }
 _Pornirea motorului() {
// cod pentru a porni motorul
 }
 _stopEngine() {
// cod pentru a opri motorul
 }
}

Folosind un caracter de subliniere de început în acest exemplu, se indică faptul că funcțiile sunt private.

9. Denumirea variabilelor globale

Variabilele care sunt clasificate ca fiind globale pot fi accesate din orice parte a bazei de cod. În timpul denumirii unor astfel de variabile globale, este esențial să folosiți nume clare și descriptive care să transmită eficient scopul propus.

De exemplu:

const MAX_PRICE = 1000;
const MIN_PRICE = 0;
funcţieverificaPreț(Preț) {
dacă (preț > MAX_PRICE) {
// cod pentru a face față prețurilor mari
 } altfeldacă (preț < MIN_PRICE) {
// cod pentru a face față prețurilor mici
 }
}

10. Numirea fișierelor

Organizarea eficientă a fișierelor este un aspect crucial al managementului de succes al proiectelor JavaScript. Pentru a asigura convenții de denumire simplificate și consecvente, este esențial să separați cuvintele în numele fișierelor folosind litere mici și cratime.

Literele mici sunt preferate deoarece JavaScript este un limbaj sensibil la majuscule, ceea ce înseamnă că limbajul tratează literele mici și mari în mod diferit. Utilizarea literelor mici pentru numele fișierelor asigură coerența și evită confuzia atunci când faceți referire la fișiere în cod.

Cratimele sunt folosite pentru a separa cuvintele în numele fișierelor, deoarece spațiile nu sunt permise în numele fișierelor. Alte alternative, cum ar fi liniuțele de subliniere sau camelCase pot fi, de asemenea, utilizate, dar cratimele sunt în general preferate pentru lizibilitatea lor.

Utilizarea cratimelor face ca numele fișierelor să fie mai accesibile pentru utilizatorii cu cititoare de ecran sau alte tehnologii de asistență.

aplicația mea/
├── src/
 ├── componente/
 ├── butonul.js
 ├── câmp de intrare.js
├── utilitare/
 ├── string-utils.js
 ├── date-utils.js
├── app.js
├── index.js

În acest exemplu, litere mici și cratime sunt folosite pentru a separa cuvintele din numele fișierelor.

Importanța respectării convențiilor de denumire în JavaScript

Respectarea convențiilor bune de denumire este un aspect esențial al scrierii codului curat și care poate fi întreținut în JavaScript. Urmând aceste convenții, vă puteți face codul mai lizibil și mai ușor de întreținut, mai ales în unele Cadre JavaScript în care vi se cere să gestionați cod voluminos, ceea ce vă poate economisi timp și efort în Pe termen lung.