Xem thêm:

Scope của biến trong Javascript

Hoisting trong Javascript

var, let và const trong Javascript

Cách khai báo, khởi tạo biến trong Javascript

Khi lập trình chúng ta thường phải sử dụng các biến để lưu trữ giá trị, dữ liệu…

Trong Javascript thì để khởi tạo, khai báo biến, chúng ta sẽ dùng var hoặc let hoặc const.

Ví dụ:

var hello = "Xin chào";
let name = "Lập trình Dễ òm";
const helloMessage = hello + " " + name;
// Kết quả: 'Xin chào Lập trình Dễ òm'

Khá dễ hiểu phải không, vậy sự khác nhau giữa chúng là gì và khi nào nên dùng var, let và const?

let và const là 2 từ khóa mới được giới thiệu trong ES6 vào năm 2015, trước đó thì khởi tạo biến chỉ có 1 cách duy nhất là sử dụng từ khóa var.

var

Scope của var

var có scope là global scope hoặc function scope.
Nếu khởi tạo biến với var ở ngoài function thì nó có scope là global scope.
Nếu khởi tạo biến với var ở trong function thì nó có scope là function scope.

Khai báo lại (redeclared) và thay đổi giá trị

var cho phép chúng ta khai báo lại(redeclared) biến với cùng tên, nhưng cùng hoặc khác giá trị mà không bị lỗi gì.

Ví dụ:
```
var hello = "Xin chào";
var hello = "Xin chào bạn";
```
var cũng cho phép chúng ta thay đổi giá trị bất cứ khi nào cần.

Ví dụ:
```
var hello = "Xin chào";
hello = "Xin chào bạn";
```

Hoisting của var?

Hoisting là gì? bạn hãy đọc thêm ở đây: Hoisting trong Javascript

Hoisting là cơ chế của Javascript sẽ chuyển các phần khai báo của biến và hàm lên top của phạm vi của biến và hàm đó.

Với var thì biến sẽ được hoisted với giá trị undefined.

Lưu ý với var

Khi làm việc với var, bạn phải chú ý thật kỹ các lưu ý sau đây.

var không báo lỗi khi khai báo lại biến với cùng tên, nên rất khó phát hiện lỗi, có thể vô tình ghi đè giá trị của 1 biến nào đó phía trên mà chúng ta không biết. Điều này làm chúng ta mất nhiều khá thời gian để debug lỗi.
Gán giá trị cho biến var ở global scope thì biến đó sẽ trở thành thuộc tính của object window.

let

Scope của let

let là block scope.
block nghĩa là code được viết trong cặp dấu {}, ví dụ function, if/else, switch - case, for/while… Nghĩa là biến được khởi tạo với let trong block thì sẽ không thể sử dụng ở ngoài block đó, var thì có thể được nhé.

Ví dụ;

{
  let hello = "Xin chào";
}
// Biến hello sẽ KHÔNG thể được sử dụng ở đây

{
  var hello = "Xin chào";
}
// Biến hello sẽ CÓ thể được sử dụng ở đây

Khai báo lại(redeclared) và thay đổi giá trị

let KHÔNG cho phép khai báo lại(redeclared) biến với cùng tên với phía trên.
Khi bạn cố tình redeclared biến thì sẽ nhận được lỗi này: error: Identifier 'variableName' has already been declared Ví dụ:
```
let hello = "Xin chào";
let hello = "Xin chào bạn";
// Kết quả: error: Identifier 'hello' has already been declared
```

Redeclared biến khác scope thì KHÔNG bị lỗi nhé. Ví dụ:

let hello = "Xin chào";

if (true) {
  let hello = "Xin chào bạn";
  console.log(hello); // "Xin chào bạn"
}

console.log(hello); // "Xin chào"

let cũng giống var, let CHO phép chúng ta thay đổi giá trị bất cứ lúc nào. Ví dụ:
```
let hello = "Xin chào";
hello = "Xin chào bạn";
```

Hoisting của let?

Cũng giống như var, let cũng được hoisted lên top của scope, NHƯNG không khởi tạo giá trị undefined như var.
Nghĩa là bạn sẽ bị báo lỗi Reference Error khi sử dụng biến với let mà chưa khai báo ở phía trên.

const

Scope của const

Tương tự như let, const cũng có scope là block.

Khai báo lại và thay đổi giá trị

const chỉ được khai báo và gán giá trị 1 lần duy nhất, giá trị của const là không thể thay đổi, nếu cố tình gán giá trị cho const, bạn sẽ nhận lỗi này: error: Assignment to constant variable.
const cũng không cho phép redeclared biến, bạn sẽ nhận được lỗi này khi cố gắng redeclare: error: Identifier 'variableName' has already been declared.

Hoisting của const?

const hoisting giống y chang let, nghĩa là bạn sẽ bị lỗi khi sử dụng biến trước khi khai báo nó.

Lưu ý với const

Giá trị của biến với const không thể thay đổi, nhưng bạn có thể thay đổi thuộc tính (properties) của object Ví dụ:

const employee = {
  firstName: "Lập trình",
  lastName: "Dễ òm",
};

employee.lastName = "Dễ òm phải không bạn"; // hợp lệ

Có thể thêm/xóa/sửa các phần tử của 1 array với const Ví dụ:
```
const employees = [1, 2, 3, 4];

employees.push(5); // [1,2,3,4,5]
```

Tóm lượt sự khác nhau của var, let và const

var là global scope hoặc function scope, let và const là block scope.
var có thể redeclared biến và gán lại giá trị, let không thể redeclared biến nhưng có thể gán lại giá trị, trong khi const thì không thể redeclared biến và cũng không thể gán lại giá trị.
Cả 3 đều được hoisted lên top của scope. Nhưng var thì hoisted với giá trị undefined, trong khi đó let và const thì hoisted nhưng không có giá trị.
var và let có thể khởi tạo và không cần gán giá trị ban đầu, sau đó có thể gán giá trị khác, nhưng const thì bắt buộc phải gán giá trị ban đầu, và const không thể gán lại giá trị.

Có thắc mắc gì các bạn cứ bình luận phía dưới nhé.

Sự khác nhau giữa Var, Let và Const trong Javascript