Var, Let i Const - U čemu je razlika?

Puno sjajnih novih značajki izašlo je s ES2015 (ES6). A sada, budući da je 2020., pretpostavlja se da se puno programera JavaScript-a upoznalo i počelo koristiti ove značajke.

Iako bi ova pretpostavka mogla djelomično biti istinita, još uvijek je moguće da su neke od ovih značajki za neke programere tajna.

Jedna od značajki koje su došle uz ES6 je dodavanje leti const, koje se može koristiti za deklariranje varijabli. Pitanje je, po čemu se razlikuju od dobrih varkoje smo koristili? Ako vam još uvijek nije jasno ovo, ovaj je članak za vas.

U ovom članku, mi ćemo raspravljati var, leta const  s obzirom na njihov opseg, korištenje i isticanje. Dok čitate, imajte na umu razlike između njih na koje ću ukazati.

Var

Prije pojave ES6 varvladale su deklaracije. Postoje problemi povezani s varijablama s kojima se deklarira var. Zbog toga je bilo potrebno da se pojave novi načini deklariranja varijabli. Prvo, shvatimo varviše prije nego što razgovaramo o tim pitanjima.

Opseg var

Opseg u osnovi znači gdje su ove varijable dostupne za upotrebu. vardeklaracije se primjenjuju globalno ili funkcioniraju / lokalno.

Opseg je globalni kada je varvarijabla deklarirana izvan funkcije. To znači da je svaka varijabla koja je deklarirana varizvan funkcijskog bloka dostupna za upotrebu u cijelom prozoru.

varje opseg funkcije kada je deklariran unutar funkcije. To znači da je dostupan i može mu se pristupiti samo unutar te funkcije.

Da biste dalje razumjeli, pogledajte primjer u nastavku.

 var greeter = "hey hi"; function newFunction() { var hello = "hello"; } 

Ovdje greeterje globalno opseg jer postoji izvan funkcije, dok helloje opseg funkcije. Dakle, ne možemo pristupiti varijabli helloizvan funkcije. Pa ako učinimo ovo:

 var tester = "hey hi"; function newFunction() { var hello = "hello"; } console.log(hello); // error: hello is not defined 

Dobit ćemo pogrešku koja je posljedica toga što hellonije dostupan izvan funkcije.

varijable varijable mogu se ponovno deklarirati i ažurirati

To znači da to možemo učiniti u istom opsegu i da neće dobiti pogrešku.

 var greeter = "hey hi"; var greeter = "say Hello instead"; 

i ovo također

 var greeter = "hey hi"; greeter = "say Hello instead"; 

Podizanje var

Dizanje je JavaScript mehanizam gdje se varijable i deklaracije funkcija premještaju na vrh svog opsega prije izvršavanja koda. To znači da ako to učinimo:

 console.log (greeter); var greeter = "say hello" 

tumači se ovako:

 var greeter; console.log(greeter); // greeter is undefined greeter = "say hello" 

Dakle, varvarijable se podižu na vrh svog opsega i inicijaliziraju s vrijednošću undefined.

Problem s var

Postoji slabost koja dolazi sa sobom   var. Upotrijebit ću primjer u nastavku da objasnim:

 var greeter = "hey hi"; var times = 4; if (times > 3) { var greeter = "say Hello instead"; } console.log(greeter) // "say Hello instead" 

Dakle, budući da times > 3vraća true, greeterredefinirano je na "say Hello instead". Iako to nije problem ako svjesno želite greeterbiti redefinirani, to postaje problem kada ne shvatite da je varijabla greeterveć definirana prije.

Ako ste koristili greeteru drugim dijelovima koda, mogli biste se iznenaditi izlaznim podacima koje biste mogli dobiti. To će vjerojatno uzrokovati puno grešaka u vašem kodu. Zbog toga su leti constneophodni.

Neka

letsada je poželjna za deklaraciju varijable. Nije iznenađenje jer dolazi kao poboljšanje vardeklaracija. Također rješava problem s varonim što smo upravo pokrili. Razmotrimo zašto je tome tako.

neka je blok opsega

Blok je dio koda ograničen sa {}. Blok živi u kovrčavim zagradama. Sve što je unutar kovrčavih zagrada blok je.

Dakle, varijabla deklarirana u bloku s let  dostupna je samo za upotrebu unutar tog bloka. Objasnit ću vam to na primjeru:

 let greeting = "say Hi"; let times = 4; if (times > 3) { let hello = "say Hello instead"; console.log(hello);// "say Hello instead" } console.log(hello) // hello is not defined 

Vidimo da upotreba helloizvan svog bloka (kovrčave zagrade tamo gdje je definirana) vraća pogrešku. To je zato što su letvarijable opsega bloka.

neka se može ažurirati, ali ne i ponovno deklarirati.

Baš kao vari varijabla deklarirana sa letmože se ažurirati u okviru svog opsega. Za razliku od toga var, letvarijabla se ne može ponovno deklarirati unutar svog opsega. Dakle, dok će ovo raditi:

 let greeting = "say Hi"; greeting = "say Hello instead"; 

ovo će vratiti pogrešku:

 let greeting = "say Hi"; let greeting = "say Hello instead"; // error: Identifier 'greeting' has already been declared 

Međutim, ako je ista varijabla definirana u različitim opsezima, neće biti pogreške:

 let greeting = "say Hi"; if (true) { let greeting = "say Hello instead"; console.log(greeting); // "say Hello instead" } console.log(greeting); // "say Hi" 

Zašto nema pogreške? To je zato što se obje instance tretiraju kao različite varijable jer imaju različite domete.

This fact makes let a better choice than var. When using let, you don't have to bother if you have used a name for a variable before as a variable exists only within its scope.

Also, since a variable cannot be declared more than once within a scope, then the problem discussed earlier that occurs with var does not happen.

Hoisting of let

Just like  var, let declarations are hoisted to the top. Unlike var which is initialized as undefined, the let keyword is not initialized. So if you try to use a let variable before declaration, you'll get a Reference Error.

Const

Variables declared with the const maintain constant values. const declarations share some similarities with let declarations.

const declarations are block scoped

Like let declarations, const declarations can only be accessed within the block they were declared.

const cannot be updated or re-declared

This means that the value of a variable declared with const remains the same within its scope. It cannot be updated or re-declared. So if we declare a variable with const, we can neither do this:

 const greeting = "say Hi"; greeting = "say Hello instead";// error: Assignment to constant variable. 

nor this:

 const greeting = "say Hi"; const greeting = "say Hello instead";// error: Identifier 'greeting' has already been declared 

Every const declaration, therefore, must be initialized at the time of declaration.

This behavior is somehow different when it comes to objects declared with const. While a const object cannot be updated, the properties of this objects can be updated. Therefore, if we declare a const object as this:

 const greeting = { message: "say Hi", times: 4 } 

while we cannot do this:

 const greeting = { words: "Hello", number: "five" } // error: Assignment to constant variable. 

we can do this:

 greeting.message = "say Hello instead"; 

This will update the value of greeting.message without returning errors.

Hoisting of const

Just like let, const declarations are hoisted to the top but are not initialized.

So just in case you missed the differences, here they are:

  • var declarations are globally scoped or function scoped while let and const are block scoped.
  • var variables can be updated and re-declared within its scope; let variables can be updated but not re-declared; const variables can neither be updated nor re-declared.
  • They are all hoisted to the top of their scope. But while var variables are initialized with undefined, let and const variables are not initialized.
  • While var and let can be declared without being initialized, const must be initialized during declaration.

Got any question or additions? Please let me know.

Thank you for reading :)