Var, Let ir Const - koks skirtumas?
Su ES2015 (ES6) pasirodė daugybė naujų blizgančių funkcijų. Manoma, kad nuo 2020 m. Daugelis „JavaScript“ kūrėjų susipažino su šiomis funkcijomis ir pradėjo jas naudoti.
Nors ši prielaida gali būti iš dalies teisinga, vis tiek įmanoma, kad kai kurios iš šių savybių kai kuriems kūrėjams lieka paslaptimi.
Viena iš funkcijų, pateiktų su ES6, yra pridėjimas let
ir const
, kurį galima naudoti kintamajam deklaruoti. Kyla klausimas, kuo jie skiriasi nuo gerų olų, var
kuriuos naudojome? Jei jums vis dar neaišku, tai šis straipsnis skirtas jums.
Šiame straipsnyje aptarsime var
, let
ir const
atsižvelgiant į jų apimtį, naudojimo ir kėlimo. Skaitydami atkreipkite dėmesį į skirtumus, į kuriuos atkreipsiu dėmesį.
Var
Iki ES6 atsiradimo var
viešpatavo deklaracijos. Tačiau yra problemų, susijusių su kintamaisiais, deklaruotais naudojant var
. Štai kodėl reikėjo, kad atsirastų naujų kintamųjų deklaravimo būdų. Pirmiausia, geriau var
aptarkime, kol aptarsime tuos klausimus.
Var. Taikymo sritis
Apimtis iš esmės reiškia, kur galima naudoti šiuos kintamuosius. var
deklaracijos yra pasauliniu mastu arba veikia / lokaliai.
Taikymo sritis yra visuotinė, kai var
kintamasis yra deklaruojamas už funkcijos ribų. Tai reiškia, kad bet kurį kintamąjį, kuris yra deklaruojamas var
už funkcijos bloko ribų, galima naudoti visame lange.
var
yra funkcijos apimtis, kai ji deklaruojama funkcijos viduje. Tai reiškia, kad jis yra prieinamas ir prie jo galima prisijungti tik vykdant šią funkciją.
Norėdami suprasti toliau, žiūrėkite toliau pateiktą pavyzdį.
var greeter = "hey hi"; function newFunction() { var hello = "hello"; }
Čia greeter
jis taikomas visame pasaulyje, nes egzistuoja už funkcijos ribų, o hello
funkcijai taikoma. Taigi negalime pasiekti kintamojo hello
už funkcijos ribų. Taigi, jei tai padarysime:
var tester = "hey hi"; function newFunction() { var hello = "hello"; } console.log(hello); // error: hello is not defined
Gausime klaidą, kuri atsiranda dėl to, kad hello
negalime naudotis už funkcijos ribų.
kintamuosius galima iš naujo deklaruoti ir atnaujinti
Tai reiškia, kad mes galime tai padaryti toje pačioje srityje ir negausime klaidos.
var greeter = "hey hi"; var greeter = "say Hello instead";
ir tai taip pat
var greeter = "hey hi"; greeter = "say Hello instead";
Var. Kėlimas
Pakėlimas yra „JavaScript“ mechanizmas, kuriame kintamieji ir funkcijų deklaracijos prieš vykdant kodą perkeliami į savo srities viršų. Tai reiškia, kad jei tai padarysime:
console.log (greeter); var greeter = "say hello"
jis aiškinamas taip:
var greeter; console.log(greeter); // greeter is undefined greeter = "say hello"
Taigi var
kintamieji iškeliami iki jų taikymo srities viršaus ir inicijuojami su reikšme undefined
.
Problema su var
Yra silpnumas, kuris atsiranda var
. Aš paaiškinsiu toliau pateiktą pavyzdį:
var greeter = "hey hi"; var times = 4; if (times > 3) { var greeter = "say Hello instead"; } console.log(greeter) // "say Hello instead"
Taigi, kadangi times > 3
grįžta tiesa, greeter
yra iš naujo apibrėžta "say Hello instead"
. Nors tai nėra problema, jei jūs sąmoningai norite greeter
būti apibrėžtas iš naujo, tai tampa problema, kai nesuvokiate, kad kintamasis greeter
jau buvo apibrėžtas anksčiau.
Jei naudojote greeter
kitose kodo dalyse, galite nustebti gautu išėjimu. Tai greičiausiai sukels daug klaidų jūsų kode. Štai kodėl let
ir const
yra būtini.
Leisti
let
dabar teikiama pirmenybė kintamųjų deklaravimui. Tai nenuostabu, nes tai yra var
deklaracijų patobulinimas . Tai taip pat išsprendžia problemą, var
kurią mes ką tik aprėpėme. Pasvarstykime, kodėl taip yra.
tegul blokuojama
Blokas yra kodo dalis, apribota {}. Blokas gyvena garbanotais petnešomis. Viskas, kas yra garbanotose petnešose, yra blokas.
Taigi kintamąjį, deklaruotą bloke su, let
galima naudoti tik tame bloke. Leiskite man tai paaiškinti pavyzdžiu:
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
Mes matome, kad naudojant hello
už jo bloko (garbanotieji petnešos, kur jis buvo apibrėžtas), gaunama klaida. Taip yra todėl, kad let
kintamieji yra blokuojami.
tegul gali būti atnaujinta, bet iš naujo nedeklaruota.
Kaip ir var
kintamasis, deklaruotas naudojant, let
gali būti atnaujintas pagal jo taikymo sritį. Skirtingai var
, let
kintamojo negalima iš naujo deklaruoti pagal jo taikymo sritį. Taigi, nors tai veiks:
let greeting = "say Hi"; greeting = "say Hello instead";
tai pateiks klaidą:
let greeting = "say Hi"; let greeting = "say Hello instead"; // error: Identifier 'greeting' has already been declared
Tačiau jei tas pats kintamasis yra apibrėžtas skirtingose srityse, klaidos nebus:
let greeting = "say Hi"; if (true) { let greeting = "say Hello instead"; console.log(greeting); // "say Hello instead" } console.log(greeting); // "say Hi"
Kodėl nėra klaidos? Taip yra todėl, kad abu atvejai traktuojami kaip skirtingi kintamieji, nes jų taikymo sritis skiriasi.
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 whilelet
andconst
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 withundefined
,let
andconst
variables are not initialized. - Nors
var
irlet
galima deklaruoti neinicijuojant,const
reikia inicijuoti deklaruojant.
Turite klausimų ar papildymų? Praneškite man.
Ačiū, kad skaitėte :)