Hướng dẫn let trong javascript

Trong hướng dẫn này, bạn sẽ tìm hiểu cách sử dụng từ khóa cho phép JavaScript để khai báo các biến trong phạm vi khối.

Trong ES5, khi bạn khai báo một biến bằng từ khóa var, phạm vi của biến là toàn cục nếu bạn khai báo nó bên ngoài hàm hoặc cục bộ trong trường hợp bạn khai báo nó bên trong hàm.

ES6 cung cấp một cách mới để khai báo một biến bằng cách sử dụng từ khóa let. Từ khóa let tương tự như từ khóa var, ngoại trừ các biến mà nó khai báo là phạm vi khối:

let variable_name;

Trong JavaScript, các khối được biểu thị bằng dấu ngoặc nhọn {}, ví dụ: if else, for, do while, while, try catch ...

if[condition] {
  // inside a block
}

Bạn xem ví dụ sau:

let x = 10;
if [x == 10] {
    let x = 20;
    console.log[x]; // 20:  reference x inside the lbock
}
console.log[x]; // 10: reference at the begining of the script

Bạn cùng xem cách hoạt động của đoạn code trên:

• Đầu tiên, khai báo một biến x và gán giá trị của nó 10.
• Thứ hai, khai báo một biến mới có cùng tên x bên trong khối if nhưng có giá trị ban đầu là 20.
• Thứ ba, console biến x cả trong và ngoài if

Bởi vì từ khóa let khai báo một biến có phạm vi khối, biến x bên trong if là một biến mới và nó thay thế biến x được khai báo ở đầu tập lệnh. Do đó, giá trị của x khi console ra là 20.

Khi chạy if xong, biến x bên trong if nằm ngoài phạm vi, do đó, giá trị của biến x console phía ngoài sẽ là 10.

let vs var

Khi bạn khai báo một biến toàn cục bằng từ khóa var, bạn đang thêm biến đó vào danh sách thuộc tính của đối tượng toàn cục. Trong trường hợp trình duyệt web, đối tượng toàn cầu là window.

Bạn xem ví dụ bên dưới

var a = 10;
console.log[window.a]; // 10

Tuy nhiên, khi bạn sử dụng từ khóa let để khai báo một biến, biến đó không được gắn vào đối tượng toàn cục như một thuộc tính. Đây là một ví dụ:

let b = 20;
console.log[window.b]; // undefined

let and callback function in a for loop

Bạn xem ví dụ bên dưới

for [var i = 0; i 4 nhưng không ở vòng lặp này sẽ trả về 5. Tại sao lại như vậy.
Lý do, giá trị của biến i bên trong hàm callback luôn là giá trị cuối cùng của i trong vòng lặp.
Trong ES6, từ khóa let khai báo một biến mới trong mỗi lần lặp , do đó, bạn chỉ cần thay thế từ khóa var bằng từ khóa let để khắc phục vấn đề.
for [let i = 0; i