Những điều cần biết về khai báo biến trong JavaScript

Khai báo biến trong JavaScript là một trong những kỹ năng cơ bản nhất mà bất kỳ lập trình viên nào cũng cần nắm vững. Biến được sử dụng để lưu trữ dữ liệu và có thể được thay đổi trong suốt quá trình chạy chương trình. Trong JavaScript, có ba cách chính để khai báo biến: sử dụng var, let, và const.

1. Khai báo biến với var

var là cách khai báo biến truyền thống trong JavaScript, được sử dụng từ các phiên bản đầu tiên của ngôn ngữ này. Tuy nhiên, var có một số hạn chế và có thể gây ra những lỗi không mong muốn do phạm vi (scope) của nó.

var myVariable = 10;
console.log(myVariable); // Output: 10

• Phạm vi (Scope): Biến khai báo với var có phạm vi toàn cục (global scope) nếu được khai báo ngoài hàm, và phạm vi cục bộ (function scope) nếu được khai báo bên trong hàm.
• Hoisting: Biến khai báo bằng var được "hoisted" lên đầu phạm vi của nó, có nghĩa là bạn có thể sử dụng biến trước khi khai báo mà không gặp lỗi.

Ví dụ về hoisting:

console.log(myVar); // Output: undefined
var myVar = 5;

2. Khai báo biến với let

let được giới thiệu trong ECMAScript 2015 (ES6) và khắc phục nhiều hạn chế của var.

let myVariable = 10;
console.log(myVariable); // Output: 10

• Phạm vi (Scope): Biến khai báo với let có phạm vi khối (block scope), nghĩa là nó chỉ tồn tại trong khối mã (block) mà nó được khai báo (dấu ngoặc nhọn {}).
• Hoisting: let cũng được hoisted, nhưng bạn không thể sử dụng biến trước khi khai báo (Temporal Dead Zone - TDZ).

Ví dụ về phạm vi khối:

if (true) {
    let myVar = 5;
    console.log(myVar); // Output: 5
}
console.log(myVar); // Error: myVar is not defined

3. Khai báo biến với const

const cũng được giới thiệu trong ECMAScript 2015 (ES6) và được sử dụng để khai báo các biến hằng số (constant variables), những biến không thể thay đổi giá trị sau khi đã được gán.

const myConstant = 10;
console.log(myConstant); // Output: 10

• Phạm vi (Scope): Giống như let, const cũng có phạm vi khối (block scope).
• Hoisting: const cũng được hoisted nhưng không thể sử dụng trước khi khai báo (Temporal Dead Zone - TDZ).
• Gán lại: Biến khai báo với const không thể được gán lại giá trị mới, nhưng nếu là một đối tượng hoặc mảng, bạn có thể thay đổi thuộc tính hoặc phần tử của nó.

Ví dụ về const:

const myConstant = 10;
myConstant = 15; // Error: Assignment to constant variable.

const myArray = [1, 2, 3];
myArray.push(4); // Hợp lệ, bạn có thể thay đổi nội dung của mảng
console.log(myArray); // Output: [1, 2, 3, 4]

Kết luận

Khi khai báo biến trong JavaScript, bạn nên sử dụng let và const thay vì var để tránh các lỗi liên quan đến phạm vi và hoisting. Sử dụng let cho các biến có giá trị thay đổi và const cho các biến có giá trị cố định (hằng số).

Ví dụ tổng hợp:

// Khai báo biến với var
var myVar = "Hello";
console.log(myVar); // Output: Hello

// Khai báo biến với let
let myLet = 20;
console.log(myLet); // Output: 20

// Khai báo biến với const
const myConst = 30;
console.log(myConst); // Output: 30

// Ví dụ về phạm vi khối với let và const
if (true) {
    let blockLet = 40;
    const blockConst = 50;
    console.log(blockLet);  // Output: 40
    console.log(blockConst); // Output: 50
}
// console.log(blockLet); // Error: blockLet is not defined
// console.log(blockConst); // Error: blockConst is not defined

Hiểu và sử dụng đúng cách khai báo biến trong JavaScript sẽ giúp mã của bạn trở nên rõ ràng, dễ bảo trì và ít lỗi hơn.