Biến là một khái niệm dùng để lưu trữ và tham chiếu giá trị. Bạn có thể tưởng tượng biến như một cái hộp chứa được đặt tên và chứa dữ liệu của mình.
Để khai báo biến trong Javascript (JS) ta có thể sử dụng var, let hoặc const .
var name = "Bqsoft";
let age = 30;
const PI = 3.14;
Trong đoạn code trên ta có biến name sử dụng var để khai báo có giá trị là "Bqsoft" (kiểu String), biến age sử dụng let để khai báo có giá trị là 30 (kiểu Number) và biến PI sử dụng const để khai báo có giá trị là 3.14 (kiểu Number).
Biến được khai báo bằng var có thể được sử dụng ngoài block scoped (code được viết trong cặp dấu {}. Ví dụ if {}, for {}, ...).
function demo() {
if (true) {
var x = 5;
}
console.log(x); // 5
}
demo()
Trong đoạn code trên ta thực hiện chạy 1 function, trong function ta sẽ log ra biến x. Biến x mặc dù được khai báo phía trong câu lệnh if nhưng sử dụng var để khai báo biến nên ta cũng có thể lấy được giá trị biến x ở phía ngoài block đó.
Lưu ý: Hiện tại không nên sử dụng var để khai báo biến vì một số vấn đề như hoisting, khả năng gán lại giá trị, ...Vì vậy từ phiên bản ES6 trở đi, người ta khuyến khích sử dụng let và const thay var để an toàn hơn trong khai báo biến.
Let ra đời để khắc phục những vấn đề của var và được giới thiệu trong ES6. Biến được khai báo với let chỉ có thể truy cập được trong block scoped (trong cặp dấu {}) và không thể khai báo lại nữa nếu trong cùng một phạm vi.
Sử dụng đoạn code trên nhưng thay var thành let:
function demo() {
if (true) {
let x = 5;
}
console.log(x); // Uncaught ReferenceError: x is not defined
}
demo()
Lúc này khi log ra sẽ báo lỗi "x is not defined" vì biến x khai báo với let phía trong lệnh if nhưng ta lại log ra ở phía ngoài block scoped nên không được.
Bây giờ khai báo lại biến x với giá trị khác phía ngoài lệnh if xem sao nhé:
function demo() {
if (true) {
let x = 5;
}
let x = 20;
console.log(x); // 20
}
demo()
Khi khai báo lại biến x thì ta log ra được x bằng 20 vì lúc này 2 biến x trên là hoàn toàn khác nhau, thuộc 2 phạm vi khác nhau nên code sẽ không xảy ra lỗi.
Const cũng ra đời trong phiên bản ES6 và cách dùng cũng tương tự như let nhưng khác ở chỗ là const thì không thể gán lại giá trị mới (với object và array thì có thể thay đổi các thuộc tính và thành phần trong đó được) sau khi đã khai báo.
function demo() {
const x = 20;
x = 50;
console.log(x); // Lỗi
}
demo()
Trong đoạn code trên sử dụng const để khai báo biến x có giá trị 20, vì vậy khi gán lại biến x bằng 50 thì sẽ phát sinh lỗi. Thông thường ta cứ nên sử dụng let để khai báo biến, với những hằng số thì dùng const.
Tóm lại, trong 3 cách khai báo biến trên ta chỉ nên dùng let và const là tốt nhất. Các bạn có thể tìm hiểu thêm ở những nguồn khác hoặc tham gia các khoá học dưới đây để nắm được những kiến thức nâng cao hơn