let & const

Zajedničke karakteristike

Block scope

Ključne reči let i const ispred promenjive deklariše promenjivu, koja je dostupna jedino u svom lokalnom domenu tzv. “block scope”. Kada se promenjiva deklariše sa let/const u okviru vitičaste zagrade, onda su vitičaste zagrade ivice njenog domena.

if (5 > 0) {
    const osoba = "Pera";
    let godine = 44;
}
console.log(osoba);   // Vraća: ReferenceError: osoba is not defined
console.log(godine);  // Vraća: ReferenceError: godine is not defined 

let & const

Nema hoistovanja promenjive pri kompajliranju

Promenjive deklarisane sa “let/const” se ne hoist-uju na vrh bloka, kao što to rade promenjive deklarisane sa “var”.

function uradi() {
  console.log(bar);   // undefined
  console.log(pi);    // ReferenceError pi is not defined
  console.log(foo);   // ReferenceError  foo is not defined
  var bar = 1;
  const pi = 3.14;
  let foo = 2;
}
uradi();

Ne prave globalne promenjive

Treba napomenuti da ključne reči “let/const” ne prave globalne promenjive čak i kada se nalazi u globalnom domenu:

var x = 'global';
let y = 'nije global';
const z = 'nije global';
console.log(this.x); // "global"
console.log(this.y); // undefined
console.log(this.z); // undefined

Specifičnosti “let” ključne reči

Block scope

Promenjiva može da se deklariše sa ključnom reči “let” i van vitičastih zagrada, pri čemu će ipak pripadi domenu koji prave te vitičaste zagrade. Ovaj izuzetak važi za slučaj kada se promenjiva deklariše u okviru izraza vezanog za iteraciju:

for (let i = 0; i < 5; i++){
    // Domen za promenjivu "i" je izmedju vitičastih zagrada
}
console.log(i); // Vraća: ReferenceError: i is not defined

Redeklarisanje promenjive u istom bloku pravi Syntax Error

Za razliku od deklaracije promenjive sa ključnom reči "var" gde je dozvoljeno ponovno redaklarisanje promenjive, redeklarisanje promenjive u istom domenu sa ključnom "let" nije dozvoljeno, i izbacuje grešku.

if (5>0) {
  let foo;
  let foo = 5; // SyntaxError thrown.
}

Zbog ovoga treba obratiti pažnju da se ne koristi u okviru "switch" izraza jer je sve jedan domen:

let x = 1;
switch(x) {
  case 0:
    let foo = 5;
    break;
  case 1:
    let foo = 10; // SyntaxError for redeclaration.
    break;
}

Ovaj problem može da se prevazidje na sledeći način:

let x = 1;
switch(x) {
  case 0: {
    let foo;
    break;
  }
  case 1: {
    let foo;
    break;
  }
}

Rešava problem iteracije i setTimeout() metode

Korišćenjem ključne reči "let" umesto "var", u okviru "for...petlje", jednostvno rešavamo poznati problem vezan za iteraciju u okviru setTimeout metode.

for (var i = 0; i < 5; i++){
    setTimeout(function(){
        console.log(i);
    }, 1000);
}   // Vraća: 5 5 5 5 5

Pošto ključna reč "let" ponovo definiše novu promenjivu “i” pri svakoj iteraciji petlje, onda se dobija očekivani rezultat:

for (let i = 0; i < 5; i++){
    setTimeout(function(){
        console.log(i);
    }, 1000);
}   // Vraća: 1 2 3 4 5

Više o ovome problemu pogledajte u članku "(Ne)moguće greške u JavaScriptu".

Specifičnost "const" ključne reči

Promenjive deklarisane sa ključnom reči "const" generiše konstantu. Konstante u JavaScriptu su "nepromenljive varijable", tj. varijable kojima se ne može ponovo dodeliti novi sadržaj.

const PI = 3.14;
// Kada zelimo da promenimo konstantu:
PI = 5; // Vraća error  "Assignment to constant variable"

Promenjivost sadržaja konstante!?

Treba napomenuti da nepromenjivost važi samo za promenjivu, ali ne i za nepromenjivost sadržaja konstante!

const nekiObjekat = {
  a : 5,
  b : 6
}
// Kada zelimo da promenimo promenjivu koja je konstanta:
nekiObjekat = 10; // Vraća error "Assignment to constant variable"

// Medjutim bez problema menjamo svojstvo objekta koji je konstanta:
nekiObjekat.a = 8;  // Ne pravi error

ili kao u sledećem primeru dodavanje novih članova nizu neće napraviti grešku:

const people = ['Tesla', 'Musk']
people.push('Berners-Lee')
console.log(people)  //Vraća:  ['Tesla', 'Musk', 'Berners-Lee']

Prava konstanta sa nepromenjivim sadržajem

Ako bi smo hteli da i sadržaj bude nepromenjiv onda je potrebno da koristimo i metodu Object.freeze():

const frozen = Object.freeze(['Ice', 'Icicle', 'Ice cube'])
frozen.push('Water')  // Vraća: Uncaught TypeError: Can't add property 3, object is not extensible

Pogledajte više o "Object.freeze()" u članku "Object() & Object.prototype"


Pregled novih JavaScript standarda

Spisak novosti

eckma-script-standard

U ovome tekstu su izlistane sve novine koje su došle u sklopu novih JavaScript standarda, a obradjene su na sajltu webprogramiranje.org kroz različite članke:

Standard Novina Članak
ES2015 Novi način deklarisanja promenjivih sa ključnim rečima let & const “let & const”
ES2015 Jednostavno definisanje podrazumevanih vrednosti parametara funukcije “Podrazumevane vrednosti parametara funkcije”
ES2015 Sintaksna poboljšanja objektnog literala “Object literal” poboljšanja
ES2015 Klase “Klase u JavaScript-u”
ES2015 Nova petlja za iteraciju kroz iterable objekte: for…of “Petlje i iteracije u JavaScript-u”
ES2015 Nove metode za rad sa nizovima: Array.from() Array.prototype.find() i Array.prototype.findIndex() “Nove metode u radu sa nizovima”
ES2015 Nova sintaksa za import/export modula “Modularno programiranje sa ES6 standardom
ES2015 Promisi “Promise i asinhrono programiranje”
ES2015 Nova metoda konstruktorske funkcije: Object.assign() Svojstva i metode konstruktorske f-je Object()
ES2015 Nove karakteristike “string-a” “Nove karakteristike string-a”
ES2015 Arrow funkcija “Arrow funkcija”
ES2015 Novi tipovi podataka Map, Set & Symbol Novi tipovi podataka Map, Set & Symbol
ES2015 Spread & Rest operatori “Spread & Rest operatori”
ES2015 Destruktuiranje podataka “Destrukuiranje u JavaScript-u”
ES2015 Iteratori & Generatori Iteratori i Generatori
ES2016 Nova metoda za rad sa nizovima: Array.prototype.inludes() “Nove metode u radu sa nizovima”
ES2016 Eksponencijalni operator ** Eksponencijalni operator **
ES2017 Nove metode konstruktorske funkcije: Object.entries, Object.values i Object.getOwnPropertyDescriptors() Svojstva i metode konstruktorske f-je Object()
ES2017 Async/Await sintaksi “Async/Await” sintaksa za bolje “Promise”