let vs var trong JavaScript
NỘI DUNG BÀI VIẾT
Trong JavaScript chúng ta có thể khai báo biến bằng cách sử dụng let hoặc là var. Vậy let vs var có gì khác nhau ? Cùng tìm hiểu ở bài viết này nhé.
Giới Thiệu
ES6 (viết tắt của ECMAScript 6) là một tập hợp các kỹ thuật nâng cao của Javascript. ECMAScript do hiệp hội các nhà sản xuất máy tính Châu Âu đề xuất làm tiêu chuẩn của ngôn ngữ Javascript. Bạn cứ nghĩ xem hiện nay có khá nhiều trình duyệt Browser ra đời và nếu mỗi Browser lại có cách chạy Javascript khác nhau thì các trang web không thể hoạt động trên tất cả các trình duyệt đó được, vì vậy cần có một chuẩn chung để bắt buộc các browser phải phát triển dựa theo chuẩn đó.
Một trong những tính năng nổi bật của ES6 đó là sự bổ sung let
và const
phục vụ cho việc khai báo biến dữ liệu.
let vs var
var
Như đã biết trong Vanilla Javascript, với từ khóa var
chúng ta có thể khai báo đa dạng các kiểu biến như number, string, boolean, etc. Trừ trường hợp được khai báo bên trong 1 function (khi đó biến var
sẽ có scope là function/locally scoped), biến var
sẽ có scope là globally scoped. Đặc biệt, biến var
còn có thêm tính chất hoisting: nghĩa là dù khai báo ở đâu thì biến đều sẽ được đem lên đầu scope trước khi code được thực hiện.
Lấy ví dụ:
console.log (greeting);
var greeting = "say hello";
sẽ được biên dịch là:
var greeting;
console.log(greeting); // greeting is undefined
greeting = "say hello";
Nhưng có một vấn đề với biến var
. Giả sử ta có ví dụ như sau:
var greeting = "hey hi";
var times = 4;
if (times > 3) {
var greeting = "say Hello instead";
}
console.log(greeting); //"say Hello instead"
Vì thỏa điều kiện if
nên greeting
khi này sẽ có giá trị là "say Hello instead"
và sẽ vẫn giữ nguyên giá trị này sau khi thoát ra khỏi block if
. Điều này sẽ không có gây vấn đề gì nhưng nếu trong trường hợp code của chúng ta lên đến hàng trăm, hàng nghìn dòng code, hoặc chúng ta cũng không biết được giá trị của biến liệu có bị thay đổi ở đoạn code nào sẽ dẫn đến việc debug là vô cùng khó khăn. Để giải quyết vấn đề trên thì ES6 cung cấp cho chúng ta thêm 2 cách khác để khai báo biến bao gồm let
và const
.
let
Một trong những nguyên nhân khiến let
có thể thay thế var
để xử lý vấn đề nêu trên là vì biến let
được khai báo sẽ có scope là block scoped chứ không phải globally hay locally scoped.
let greeting = "say Hi";
let times = 4;
if (times > 3) {
let hello = "say Hello instead";
console.log(hello); // "say Hello instead"
}
console.log(hello); // hello is not defined
Chúng ta có thế thấy là đối với biến có scope là block scoped nếu ra khỏi scope được khai báo thì sẽ không thể sử dụng được nữa.
let
cho phép chúng ta cập nhật giá trị của biến chứ không cho phép chúng ta tái khái báo lại biến đó.
let greeting = "say Hi";
console.log(greeting); //"say Hi"
greeting = "say Hello instead";
console.log(greeting); //"say Hello instead"
-----------------------------------------------------
let greeting = "say Hi";
let greeting = "say Hello instead"; // error: Identifier 'greeting' has already been declared
Tuy nhiên, đối với các block khác nhau thì việc tái khai báo biến sẽ không sinh ra lỗi vì đối với từng scope, mỗi biến sẽ được xem xét là 1 biến riêng khác biệt.
let greeting = "say Hi";
if (true) {
let greeting = "say Hello instead";
console.log(greeting); // "say Hello instead"
}
console.log(greeting); // "say Hi"
Giống với var
, let
cũng có tính hoisting tuy nhiên lại khác nhau ở chỗ thay vì var
được khởi tạo với giá trị là undefined
thì let
sẽ không có bất kỳ giá trị khởi tạo nào. Điều này dẫn đến việc nếu chúng ta sử dụng biến let
trước khi khai báo thì sẽ gặp lỗi Reference Error
.
Hi vọng đọc tới đây mọi người có thể phân biệt được let vs var rồi ^^
Nguồn: https://viblo.asia/p/phan-biet-kieu-bien-var-let-va-const-trong-javascript-ORNZqaOnZ0n
Trả lời