Differenza tra let e var in JavaScript

di Lorenzo Neri
0 commento 192 visualizzazioni

Che differenza c’è tra “let” e “var” in JavaScript? È una novità introdotta con ES6 e scopriamo che differenza c’è in questo articolo.

Con l’arrivo di ECMAScript 6 è stato introdotto “let”, di cui ti lascio le referenze qui.

La vera domanda è: “Che differenza c’è tra “let” e “var”?

Regole di scope

No, non quelle per pulire il pavimento 😀

Sto parlando dello scope, ovvero dove una variabile può agire in una determinata porzione di codice.

Di fatto, la prima differenza tra “let” e “var” è proprio lo scope.

Quando dichiari una variabile usando la parola chiave “var”, la variabile è legata allo scope della funzione, quindi potrà essere utilizzata all’interno della stessa.

Quando dichiari una variabile tramite la parola chiave “let” invece è legata al blocco dentro cui è dichiarata. Per blocco intendo la coppia di parentesi graffe.

Per farti un esempio:

function faiQualcosa(){
   var pluto="bau";
   console.log(pluto);
   {
      let paperino="sberequack";
      console.log(paperino);
   }
   //ERRORE!
   console.log(paperino);
}

Ovviamente, questo non è sufficiente a capire per quale motivo usare “let” piuttosto che “var”, era per farti vedere la prima differenza tra i due, dobbiamo andare oltre.

Hoisting

Le variabili dichiarate tramite “var” sono “hoistate” in cima al blocco di codice a cui appartengono.

“Spetta che vuol dire ‘sta roba in tecnichese?!”

Significa che sono accessibili all’interno del blocco di codice in cui sono dichiarate prima ancora di essere veramente dichiarate.

Le variabili dichiarate tramite “let” invece non sono inizializzate e tantomeno accessibili fintanto che non si arriva alla riga di codice in cui sono davvero dichiarate.

Cerchiamo di capire meglio questa differenza tra usare “let” e “var”.

function faiQualcosa(){
  console.log(pluto);  //Mi vedrò a console un bel "undefined"
  var pluto="bau";
  console.log(pluto); //Mi vedrò a console un bel "bau"

  console.log(paperino);  //Mi vedrò a console un bell'erroraccio!
  let paperino="sberequack";
  console.log(paperino); //Qui invece funzionerebbe a dovere
}

Sì, lo so.

JavaScript sembra scritto da una mente pazza, non per nulla ho voluto raccogliere varie assurdità di JavaScript in questo articolo.

Proprietà globali

Sempre riferendoci allo scope, ma questa volta globale, le variabili dichiarate tramite “let” non sono accessibili a livello globale di script tramite l’oggetto “window” cosa che invece avviene con quelle dichiarate tramite “var”.

Questa, è la terza differenza tra le due, per intenderci:

var pluto="bau";
let paperino="sberequack";
console.log(window.pluto); //Apparirà "bau"
console.log(window.paperino); //Apparirà un bel "undefined"

Ridichiarazione

Vediamo l’ultima differenza tra “let” e “var” in JavaScript!

Se usiamo la modalità “strict” di cui ho parlato in questo articolo succede questo:

"use strict";

var pluto="bau";
var pluto="bau bau"; //Nessun problema: il valore viene rimpiazzato

let paperino="sberequack";
let paperino="qua qua qua"; //Errore di sintassi: paperino è già stata dichiarata!!!

Potrebbero interessarti

Lascia un commento

Questo sito potrebbe fare uso di cookie e siccome l'UE mi obbliga a fartelo presente, eccoti il classico banner dove puoi decidere come gestirli. Accetta Leggi di più