Deklaracja zmiennych i stałych w JavaScript w ES6 ZTJ ES2015 i późniejszych

ES6

ES6 – zachowuje kompatybilność, zatem wszystko opisane w artykule Deklaracja zmiennych i stałych w JavaScript przed ES6 jest nadal aktualne i możliwe.

ES6 wprowadza nowy sposób zapisu zmiennych i stałych. ES6 rozbudowuje deklaracje zmiennych i stałych, dodając deklaracje zmiennych przy użyciu instrukcji let oraz stałych ze słowem kluczowym const.

let

Zmienne deklarowane przy użyciu instrukcji let – mają zasięg blokowy, nie są można ich deklarować ponownie.

Przykład deklaracji i zasięgu

{
  let magicLetNumber = 12;
  console.log(magicLetNumber);
}
console.log(magicLetNumber);
//12
//ReferenceError: magicLetNumber is not defined

Odwoływanie się do zmiennej która jest deklarowane z let przed miejsce zapisania instrukcji let powoduje zgłoszenie błędu. Do momentu wywołania instrukcji let nie możemy wcześniej wykorzystywać zmiennej letNumber, jest ona zadeklarowane ale istnieje w tzw. tymczasowej martwej strefie a.k.a TDZ, a jakiekolwiek odwołania do niej powodują w przeciwieństwie do var zgłoszenie błędu, przykład poniżej.

{
  console.log(varNumber); //zmienna zadeklarowana z var istnieje i znajduje się w okalającym zasięgu funkcyjnym, jeśli go brak to globalnym
  console.log(letNumber); //error TDZ

  let letNumber = 12;
  var varNumber = 12;

}
//undefined
//ReferenceError: magicLetNumber is not defined

Ponowna deklaracja: var vs let

var varNumber1 = 12;
var varNumber1 = 13;
console.log(varNumber1);
//12

let letNumber1 = 14;
let letNumber1 = 15; //error
console.log(letNumber1);
//Uncaught SyntaxError: Identifier 'letNumber1' has already been declared

Zmiana wartości

let letNumber2 = 17;
letNumber2 = 18;
console.log(letNumber2);
//18

const

Stałe - również mają zasięg blokowy. Są to stałe referencje, które wyeliminować mają możliwość zmiany referencji. Tak więc jeśli są zadeklarowane z wartością typu prostego nie możemy zmienić ich wartości ani zadeklarować ponownie. W przypadku gdy są referencją do obiektu nie możemy zmienić referencji, ale możemy zmieniać właściwość wewnątrz obiektu.

Przypisanie

const CONST_NUMBER = 12;
CONST_NUMBER = 12; //Uncaught TypeError: Assignment to constant variable.

Ponowna deklaracja

const CONST_NUMBER = 12;
const CONST_NUMBER = 12; //Uncaught SyntaxError: Identifier 'CONST_NUMBER' has already been declared.

Możliwość zmiany właściwości obiektu

const CONST_OBJECT = {}
CONST_OBJECT.a = 1;
console.log(CONST_OBJECT);
//{a: 1}

Spostrzeżenie.

Ogólnie wykonując deklaracje pożądane jest deklarowanie w następującym kierunku, jeśli to możliwe przy użyciu const, później let a na samym końcu wykorzystywanie var.