Różnica między let i const polega na tym, że po powiązaniu wartości/obiektu ze zmienną za pomocą const, nie można ponownie przypisać do tej zmiennej. Innymi słowy przykład:

const something = {};
something = 10; // Error.

let somethingElse = {};
somethingElse = 1000; // This is fine.

Szczegóły pytania twierdzą, że jest to zmiana z ES5 - to jest rzeczywiście nieporozumienie. Użycie const w przeglądarce, która obsługuje tylko ECMAScript 5, zawsze spowoduje błąd. Twierdzenie const nie istnieje w ECMAScript 5. Zachowanie w jest albo js Bin jest mylące co do tego, jaki rodzaj JavaScript jest uruchamiany, albo to błąd przeglądarki.

W praktyce przeglądarki nie tylko przechodziły od 0% wsparcia dla ECMAScript 2015 (ECMAScript 6) do 100% za jednym razem - funkcje są dodawane bit po bitach, dopóki przeglądarka nie będzie w pełni zgodna. To, co js Bin nazywa "JavaScript", oznacza po prostu to, co ECMAScript obsługuje obecnie twoja przeglądarka - nie oznacza " ES5 " lub " ES6 " ani niczego innego. Wiele przeglądarek obsługiwało const i let zanim w pełni obsługiwały ES6, ale niektóre (jak Firefox) traktowały const jak let przez jakiś czas. Jest prawdopodobne, że przeglądarka pytającego obsługiwała let i const, ale nie zaimplementowała ich poprawnie.

Po Drugie, narzędzia takie jak Babel i Traceur nie sprawiają, że ES6 "działa" w starszej przeglądarce - zamiast tego zmieniają kod ES6 w ES5, który robi mniej więcej to samo. Traceur prawdopodobnie zamienia const stwierdzenia w var stwierdzenia, ale wątpię, aby zawsze wymuszało to, że semantyka const stwierdzenia są dokładnie replikowane w ES5. Korzystanie z JS Bin do uruchomienia ES6 przy użyciu Traceur nie da dokładnie takich samych wyników jak uruchomienie ES6 w przeglądarce w pełni zgodnej ze specyfikacją ES6.

Ważne jest, aby pamiętać, że const nie czyni wartości lub obiektu niezmiennym.

const myArray = [];
myArray.push(1); // Works fine.
myArray[1] = 2; // Also works fine.
console.log(myArray); // [1, 2]
myArray = [1, 2, 3] // This will throw.

Prawdopodobnie najlepszym sposobem na uczynienie obiektu (płytko) niezmiennym w tej chwili jest użycie Object.freeze() na nim. Jednak to sprawia, że sam obiekt jest tylko do odczytu; wartości właściwości obiektu mogą być nadal mutowane.

Let

• Użyj zakresu blokowego w programowaniu.
• dla każdego bloku Stwórz swój własny nowy zakres, do którego nie możesz uzyskać dostępu poza tym blokiem.
• wartość może być zmieniana tyle razy, ile chcesz.

• Let jest niezwykle przydatny dla zdecydowanej większości kodu. Może znacznie zwiększyć czytelność kodu i zmniejszyć ryzyko błędu programowania.

  let abc = 0;
  
  if(true)
   abc = 5 //fine
  
  if(true){
    let def = 5
  }
  console.log(def)
  

Const

• pozwala być niezmiennym z zmienne.
• Const jest dobrą praktyką zarówno pod względem czytelności, jak i konserwacji i unika używania literałów magicznych, np.]}

  // Low readability
  if (x > 10) {
  }
  
  //Better!
  const maxRows = 10;
  if (x > maxRows) {
   }
  

• Deklaracje Const muszą być zainicjowane

   const foo; // ERROR: const declarations must be initialized
  

• const jest przestrzenią blokową tak jak widzieliśmy z let: +

const foo = 123;
if (true) {
    const foo = 456; // Allowed as its a new variable limited to this `if` block
}

Podsumowanie:

ZARÓWNO let jak i const są sposobami deklarowania zmiennych o zasięgu bloku. Jest jednak jedna duża różnica:

• zmienne zadeklarowane przez let można przypisać ponownie.
• zmienne zadeklarowane przez const muszą być zainicjalizowane, gdy są zadeklarowane i nie mogą być ponownie przypisane.

Jeśli spróbujesz przypisać zmienne ze słowem kluczowym const, otrzymasz następujący błąd (chrome devtools):

Dlaczego mamy tego używać?

Jeśli wiemy, że chcemy przypisać zmienną raz i że nie chcemy ponownie przypisać zmiennej, użycie słów kluczowych {[2] } oferuje następujące zalety:

• komunikujemy się w naszym kodzie, że nie chcemy ponownie przypisać zmiennej. W ten sposób, jeśli inni programiści patrzą na Twój kod (lub nawet na twój własny kod, który napisałeś jakiś czas temu), wiesz, że zmienne deklarowane przez const nie powinny być przenoszone. W ten sposób nasz kod staje się bardziej deklaratywny i łatwiejszy do pracy.
• wymuszamy zasadę braku możliwości przypisania zmiennej (silnik JS wyrzuca błąd). W ten sposób, jeśli przypadkowo spróbujesz przypisać zmienną, która nie ma być przypisana, możesz to wykryć na wcześniejszym etapie (ponieważ jest ona zalogowana do konsoli).

Zastrzeżenie:

Chociaż zmienna zadeklarowana przez const nie może być ponownie przypisana, nie oznacza to, że przypisany obiekt nie jest zmienny. Na przykład:

const obj = {prop1: 1}

// we can still mutate the object assigned to the 
// variable declared with the const keyword
obj.prop1 = 10;
obj.prop2 = 2;

console.log(obj);

Jeśli chcesz również, aby twój obiekt nie był zmienny, możesz użyć Object.freeze() w tym celu.

Let and const

Zmienne zadeklarowane przez let i const eliminują specyficzny problem podnoszenia, ponieważ są ograniczone do bloku, a nie do funkcji.

Jeśli zmienna jest zadeklarowana za pomocą let LUB const wewnątrz bloku kodu (oznaczonego nawiasami klamrowymi {}), to zmienna pozostaje w tzw. martwej strefie czasowej, dopóki deklaracja zmiennej nie zostanie przetworzona. To zachowanie zapobiega dostępowi do zmiennych dopiero po ich zadeklarowane.

Zasady korzystania z let i const

let i const mają również inne ciekawe właściwości.

• zmienne zadeklarowane przez let mogą być ponownie przypisane, ale nie mogą być ponownie zgłoszony w tym samym zakresie.
• zmienne zadeklarowane z const muszą mieć przypisaną wartość początkową, ale nie może być ponownie zgłoszony w tym samym zakresie i nie może być przeniesiony.

Przypadki użycia

Pytanie brzmi kiedy należy używać let i const? Ogólna zasada jest następująca:

• użyj let, gdy planujesz przypisać nowe wartości do zmiennej i
• użyj const, gdy nie planujesz przypisać nowych wartości do zmienna.

Ponieważ {[1] } jest najsurowszym sposobem deklarowania zmiennej, sugerujemy, aby zawsze deklarować zmienne za pomocą const, ponieważ ułatwi to rozumowanie Twojego kodu, ponieważ wiesz, że identyfikatory nie zmienią się przez cały okres życia Twojego programu. Jeśli znajdź, że musisz zaktualizować zmienną lub zmienić ją, a następnie wróć i przełącz ją z const na let.

ES6 let i const

Nowy let pozwala zadeklarować zmienną, która jest ograniczona w zakresie do bloku (zmienna lokalna). Główną różnicą jest to, że zakres zmiennej var jest całką funkcji zamykającej:

if (true) {
  var foo = 42; // scope globally
}

console.log(foo); // 42

Użycie let w zakresie:

if (true) {
  let foo = 42; // scoped in block
}

console.log(foo); // ReferenceError: bar is not defined

Użycie var w zakresie funkcji jest takie samo jak użycie let:

function bar() {
  var foo = 42; // scoped in function
}

console.log(foo); // ReferenceError: bar is not defined

Słowo kluczowe let dołącza deklarację zmiennej do zakresu dowolnego bloku, w którym jest zawarta do środka.

Różnica Kolejności Deklaracji

Kolejną różnicą między let i var jest kolejność deklaracji / inicjalizacji. Dostęp do zmiennej zadeklarowanej przez let wcześniej niż jej deklaracja powoduje wywołanie ReferenceError .

console.log(a); // undefined
console.log(b); // ReferenceError: b is not defined

var a = 1;
let b = 2;

Za pomocą const

Z drugiej strony używanie ES6 const jest podobne do używania let, ale po przypisaniu wartości nie można jej zmienić. Użyj const jako niezmiennej wartości, aby zapobiec przypadkowo ponownie przypisany:

const num = 42;

try {
  num = 99;
} catch(err) {
  console.log(err);
  // TypeError: invalid assignment to const `number'

}

num; // 42

Użyj const, aby przypisać zmienne, które są stałe w rzeczywistym życiu(np. temperatura zamarzania). JavaScript const nie polega na tworzeniu niezmiennych wartości, nie ma to nic wspólnego z wartością, const ma zapobiec ponownemu przypisaniu innej wartości do zmiennej i sprawić, że zmienna będzie tylko do odczytu. Jednak wartości mogą być zawsze zmieniane:

const arr = [0, 1, 2];
arr[3] = 3; // [0, 1, 2, 3]

Aby zapobiec zmianie wartości, użyj Object.freeze():

let arr = Object.freeze([0, 1, 2]);
arr[0] = 5;

arr; // [0, 1, 2]

Używanie let z For Pętla:

Szczególny przypadek, gdzie let jest naprawdę przydatny, znajduje się w nagłówku for pętli:

for (let i = 0; i <= 5; i++) {
  console.log(i);
}

// 0 1 2 3 4 5

console.log(i); // ReferenceError, great! i is not global

Można to również zastosować do innych pętli, takich jak for...in i for...of.

• Deklaracje Var mają globalny zasięg lub zasięg funkcji, gdy let i const mają zasięg blokowy.

• Zmienne Var mogą być aktualizowane i ponownie deklarowane w jego zakresie; niech zmienne mogą być aktualizowane, ale nie ponownie deklarowane; zmienne const nie mogą być aktualizowane ani ponownie deklarowane.

• / Align = "left" / But while var zmienne są inicjalizowane zmiennymi undefined, let i const są nie zainicjowany.

• While var I let mogą być zadeklarowane bez inicjalizacji, const musi być zainicjowany podczas deklaracji.

Oto kilka notek, które zrobiłem, które pomogły mi w tym temacie. Również porównując const i let do var.

Oto var:

// Var
// 1. var is hoisted to the top of the function, regardless of block
// 2. var can be defined as last line and will be hoisted to top of code block
// 3. for undefined var //output error is 'undefined' and code continues executing
// 4. trying to execute function with undefined variable
// Example: // log(myName); // output: ReferenceError: myName is not defined and code stops executing 

Oto let i const:

// Let and Const
// 1. use `const` to declare variables which won't change
// 2. `const` is used to initialize-once, read-only thereafter
// 3. use `let` to declare variables which will change
// 4. `let` or `const` are scoped to the "block", not the function
// 5. trying to change value of const and then console.logging result will give error
// const ANSWER = 42;
// ANSWER = 3.14159;
// console.log(ANSWER);
// Error statement will be "TypeError: Assignment to constant variable." and code will stop executing
// 6. `let` won't allow reference before definition
// function letTest2 () {
//   log(b);
//   let b = 3;}
// Error statement will be "ReferenceError: b is not defined." and code will stop executing

Var

The var keyword was introduced with JavaScript. 
It has global scope.    
It can be declared globally and can be accessed globally.   
Variable declared with var keyword can be re-declared and updated in the same scope.
Example:
function varGreeter(){
  var a = 10;        
  var a = 20; //a is replaced
  console.log(a);
}
varGreeter();

Jest podniesiony.

Example:
{
  console.log(c); // undefined. 
  //Due to hoisting
  var c = 2;
}

Let

The let keyword was added in ES6 (ES 2015) version of JavaScript.
It is limited to block scope.
It can be declared globally but cannot be accessed globally.
Variable declared with let keyword can be updated but not re-declared.
Example:
function varGreeter(){
  let a = 10;        
 let a = 20; //SyntaxError: 
 //Identifier 'a' has already been declared
  console.log(a);
}
varGreeter();

Example:
{
  console.log(b); // ReferenceError: 
  //b is not defined
  let b = 3;
}

Global object property

  var no1 = "123";  // globally scoped
  let no2 = "789"; // globally scoped

  console.log(window.no1); // 123
  console.log(window.no2); // undefined

Redeklamacja:

'use strict';

  var name= "Keshav";
  var name= "Keshav Gera"; // No problem, 'name' is replaced.

  let surname= "Rahul Kumar";
  let surname= "Rahul Khan "; // SyntaxError: Identifier 'surname' has already been declared

Podnoszenie

function run() {
    console.log(name); // undefined
    var name= "Keshav";
    console.log(name); // Keshav
}

 run();

 function checkHoisting() {
     console.log(name); // ReferenceError
     let name= "Keshav";
     console.log(name); // Keshav
 }
 checkHoisting();

Notatka: W przypadku var otrzymasz undefined, w przypadku let otrzymasz błąd referencji

Const

It allows you to be immutable with variables.

Deklaracje Const muszą być zainicjowane

const name; // ERROR: const declarations must be initialized

A const is block scoped like we saw with let:+

const num = 10;
if (true) {
 const num = 20; // Allowed as its a new variable limited to this `if` block
}