Valaki ezt el tudná magyarázni?

A var érvényességi tartománya funkción belüli, míg a let scope-ja blokkon belüli. A let (és a const) egy viszonylag új dolog, az ES2015-ben lett deklarálva, azért nem hallottál róla. Előtte JS-ben nem volt lehetőség blokk-szintű változó definiálására.

A var-féle deklarációval csak az gond, hogy nehezebben átlátható, hol érvényes és hol nem. Nézd az alábbi példát:

function printMatrix (matrix) {

for (var i = 0; i < matrix.length; i++) {

var line = matrix[i];

for (var i = 0; i < line.length; i++) {

var element = line[i];

console.log(element);

}

}

}

var matrix = [

[1, 2, 3],

[4, 5, 6],

[7, 8, 9]

];

printMatrix(matrix);

Amikor meglátod ezt a kódrészletet, az hihetnéd, hogy van két egymásba ágyazott ciklusod, amikor soronként és oszloponként végigiterálnak a mátrixban, és kiírják a tartalmát. Ehelyett az történik, hogy a külső ciklusban definiált i változót a belső ciklusban lazán felülírod, merthogy a függvény-szintű scope miatt a két i változó gyakorlatilag ugyanaz. Így a függvény eredmény, ha meghívod a mátrixra, ez lesz:

1

2

3

Viszont ha átírod a var-t let-re, akkor már a várt kimenetet kapod.

"Imádom" az ilyen webes "tutorialokat". "Csináld így, mer én aszondom." Minimálisnál is kevesebb magyarázat, nehogy még az ember mélyebben is megértse. Aztán mond egy mindenféle indoklás nélküli véleményt, hogy ezt csináld, azt meg ne, "mer én aszondom". Aztán vagy igaza van, vagy nincs. De egy biztos: a néző az okot nem fogja megtudni.

Egyébként meg: hülyeség. A var és a let között két lényeges különbség van. 1.: a var a teljes függvényben él, amiben létrehozták, míg a let csak az aktuális blokkban. Normális körülmények között, egy kicsit is átgondoltan felépített programban nem fog a kettő közötti különbség kiütközni. Oké, ebben megoszlanak a vélemények, de én a klasszikus irányelvet szoktam követni: a változókat mindig a függvény elején hozom létre, így könnyen átlátom, hogy milyen változóim vannak. Az, hogy ott deklarálom a változót, ahol épp eszembe jut használni, az lehet, hogy kényelmes, de az első lépés a spagetti-kód felé. De ha már blokkon belül deklarálom, akkor miért szűnjön meg a blokk végeztével? Szintén spagetti-kód az, ahol baj, ha egy változó az egész függvényben él. Meg az is eléggé "furcsa", ha "csak úgy" blokkba teszünk pár utasítást. Oké, talán lehet létjogosultsága, mondjuk egy if-nél, ahol az elágazáson belül jön létre a változó, és utánna meg is szűnik... de ha nem selejtes a programozó, akkor szemernyi gondot sem okoz egy már létező, a függvény elején deklarált változót használni. Csak mondjuk a blokk elején le kell nullázni az értékét. De ez meg alap lenne...

2. A let nem engedi meg az újradefiniálást. Var-ral egymás után kétszer "létrehozhatjuk" ugyanazt a változót. Let-tel nem.

1. A fő különbség a változó deklarálásának hatókörében keresendő. A var - attól függően, hogy globálisan (a függvényen kívül) vagy lokálisan (a függvényen belül) deklarálod - globális/lokális hatókörű. A let meg "szigorúbb", blokkszintű (szóval egy cikluson, feltételen, stb... belülre korlátozódik) - de úgyanúgy használható lokális/globális változóként is.

Szóval var esetén:

var sum = 0;

for (var i = 0; i < 10; i++) {

sum += i;

}

console.log(i); // Itt 10 lesz a konzolon

let esetén

let sum = 0;

for (let j = 0; j < 10; j++) {

sum += j;

}

console.log(j); // Itt meg dob egy "ReferenceError: j is not defined" hibát

2. A let-tet nem lehet újradeklarálni.

Szóval ez megengedett:

var adat = 10;

var adat = 20;

console.log(adat);

ez nem:

let masikAdat = 30;

let masikAdat = 40;

3. A var kulcsszóval deklarált változó a deklaráció előtt már rendelkezik egy "undefined" (meghatározatlan) értékkel (ezt nevezik "hoisting"-nek):

console.log(foo); // undefined

var foo = "Foo";

console.log(foo); // Foo

a let meg nem:

console.log(bar); // ReferenceError

let bar = "Bar";

console.log(bar); // Bar