Kiểm Tra Sự Tồn Tại Của Biến trong JavaSCript

Trong JavaScript các biến cần được khai báo trước khi sử dụng. Trường hợp một biến được khai báo nhưng chưa được gán giá trị thì giá trị mặc định của biến sẽ là undefined.

var a;
console.log(a); // undefined

Nếu chúng ta sử dụng một biến chưa được khai báo JavaScript sẽ báo lỗi. Trong ví dụ dưới đây biến b được sử dụng dù chưa được khai:

console.log(testVariable); // Báo lỗi: "ReferenceError: b is not defined"

Lúc này JavaSCript sẽ báo về lỗi ReferenceError: b is not defined trong console như hình phía dưới:

Câu hỏi được đưa ra ở đây đó là làm thế nào để kiểm tra một biến đã được khai báo hay chưa?

JavaScript: Sai Lầm Khi Kiểm Tra Sự Tồn Tại Của Biến trong JavaSCript

Rất nhiều bạn khi gặp câu hỏi này đã đưa ra câu trả lời là kiểm tra trực tiếp giá trị của biến:

if (testVariable) {
    // ...
}

Tuy nhiên lúc này thì JavaScript sẽ báo lỗi do biến testVariable chưa được khai báo.

Một số khác thì sử dụng đối tượng window để kiểm tra:

if (window.testVariable) {
    console.log("biến testVariable tồn tại");
} else {
    console.log("biến testVariable không tồn tại");
}

Giải thích đoạn code trên là bởi vì trong JavaScript mọi biến được khai báo trong phạm vi toàn cục (hay global) sẽ là một thuộc tính của đối tượng window object.

var testVariable = 100;
console.log(window.testVariable); // 100
console.log(window.testVariable == testVariable); // true

Do trong JavaScript chúng ta có thể truy cập giá trị của các thuộc tính không tồn tại do đó chúng ta có thể kiểm tra một biến được khai báo hay chưa sử dụng. Với các biến chưa được khai báo thì thuộc tính tương ứng với tên biến của window object lúc này sẽ có giá trj là undefined:

console.log(window.abcdNotExists); // undefined

Tuy nhiên thì cách kiểm tra này chưa hoàn toàn đáp ứng đúng được yêu cầu đưa ra là kiểm tra một biến được khai báo hay chưa vì đối với một biến được khai báo nhưng chưa được gán giá trị thì thuộc tính với tên tương ứng với biến này của đối tượng window cũng sẽ trả về giá trị là undefined (giống với trường hợp của các biến chưa được khai báo hay chưa tồn tại):

var abcdNotExists;
console.log(window.abcdNotExists); // undefined

Như vậy cách làm đúng ở đây sẽ phải là gì? Câu trả lời đó là sử dụng toán tử typeof.

JavaScript: Kiểm Tra Sự Tồn Tại Của Biến Sử Dụng Toán Tử typeof

Trong JavaScript, để kiểm tra một biến tồn tại hay không chúng ta có thể sử dụng toán tử typeof. Toán tử typeof trong JavaScript được dùng để kiểm tra kiểu dữ liệu của biến, object hoặc bất kỳ một giá trị nào cho trước:

typeof 123; // number
typeof "123" // string

function test() {}
typeof test // "function"

myObject = {}
typeof myObject // "object"

Chúng ta có thể áp dụng toán tử typeof ngay cả với biến chưa được khai báo. Trường hợp biến chưa được khai báo thì toán tử này sẽ trả về chuỗi "undefined" (lưu ý giá trị trả về là kiểu chuỗi và khác với giá trị undefined trong JavaScript).

Áp dụng sử dụng toán tử typeof để kiểm tra sự tồn tại của biến testVariable thì đoạn code lúc này có thể viết như sau:

if (typeof testVariable == "undefined") {
    console.log("biến testVariable chưa được khai báo");
} else {
    console.log("biến testVariable đã được khai báo với giá trị", testVariable);
}