Jaka jest różnica między var, let a const?

var ma zasięg funkcji, podczas gdy let i const mają zasięg blokowy. var można redeklarować i nadawać mu nowe wartości, let można nadawać nowe wartości, ale nie można go redeklarować w tym samym zakresie, a const nie można ani redeklarować, ani nadawać mu nowych wartości. Zmienne zadeklarowane za pomocą var są podnoszone (hoisting) z inicjalizacją do undefined, podczas gdy let i const również są podnoszone, ale pozostają w "strefie tymczasowej martwej" do momentu inicjalizacji.

// var ma zakres funkcji
function przykladVar() {
  if (true) {
    var x = 10;
    console.log(x); // 10
  }
  console.log(x); // 10 (x jest widoczny tutaj)
}

// let i const mają zakres blokowy
function przykladLetConst() {
  if (true) {
    let y = 20;
    const z = 30;
    console.log(y); // 20
    console.log(z); // 30
  }
  // console.log(y); // Błąd ReferenceError: y nie jest zdefiniowane
  // console.log(z); // Błąd ReferenceError: z nie jest zdefiniowane
}

// var można redeklarować i nadawać nowe wartości
var a = 1;
var a = 2; // Redeclaracja
a = 3; // Nadanie nowej wartości
console.log(a); // 3

// let można nadawać nowe wartości, ale nie można go redeklarować w tym samym zakresie
let b = 4;
// let b = 5; // Błąd SyntaxError: identyfikator 'b' już zadeklarowany
b = 6; // Nadanie nowej wartości
console.log(b); // 6

// const nie można ani nadawać nowych wartości, ani redeklarować
const c = 7;
// const c = 8; // Błąd SyntaxError: identyfikator 'c' już zadeklarowany
// c = 9; // Błąd TypeError: Przypisanie do stałej
console.log(c); // 7 (dla typów prymitywnych)

// Hoisting
console.log(hoistedVar); // undefined (var został podniesiony i zainicjowany do undefined)
var hoistedVar = "Ja jestem var";

// console.log(hoistedLet); // Błąd ReferenceError: Nie można uzyskać dostępu do 'hoistedLet' przed inicjalizacją
// let hoistedLet = "Ja jestem let"; // Jest w strefie tymczasowej martwej

Kluczowe różnice podsumowano w tabeli:

Cecha	var	let	const
Zakres	Funkcyjny	Blokowy	Blokowy
Redeclaracja	Tak	Nie (w tym samym zakresie)	Nie
Nadpisanie	Tak	Tak	Nie (dla typów prymitywnych)
Hoisting	Tak (z undefined)	Tak (w strefie tymczasowej)	Tak (w strefie tymczasowej)
Wczesna inicjalizacja	Nie wymaga inicjalizacji	Nie wymaga inicjalizacji	Wymaga inicjalizacji

Ważne jest, aby zauważyć, że dla obiektów i tablic zadeklarowanych za pomocą const, sama zmienna nie może być nadpisana do innego obiektu/tablicy, ale zawartość obiektu/tablicy może być zmieniona.

const mojObiekt = { klucz: 'wartość' };
// mojObiekt = { nowyKlucz: 'nowaWartość' }; // Błąd TypeError: Przypisanie do stałej
mojObiekt.klucz = 'nowaWartość'; // Możliwe
console.log(mojObiekt); // { klucz: 'nowaWartość' }

const mojaTablica = [1, 2];
// mojaTablica = [3, 4]; // Błąd TypeError: Przypisanie do stałej
mojaTablica.push(3); // Możliwe
console.log(mojaTablica); // [ 1, 2, 3 ]