Article Categories
- All Categories
-
Data Structure
-
Networking
-
RDBMS
-
Operating System
-
Java
-
MS Excel
-
iOS
-
HTML
-
CSS
-
Android
-
Python
-
C Programming
-
C++
-
C#
-
MongoDB
-
MySQL
-
Javascript
-
PHP
-
Economics & Finance
JavaScript undefined Property
The JavaScript undefined property represents a value that indicates a variable has been declared but not assigned a value, or a property that doesn't exist.
What is undefined?
undefined is a primitive value automatically assigned to variables that are declared but not initialized, and to object properties that don't exist.
Common Cases Where undefined Occurs
// Declared but not assigned
let age;
console.log(age); // undefined
// Function with no return value
function greet() {
console.log("Hello");
}
let result = greet();
console.log(result); // undefined
// Accessing non-existent object property
let person = {name: "John"};
console.log(person.age); // undefined
// Array element that doesn't exist
let arr = [1, 2, 3];
console.log(arr[5]); // undefined
undefined Hello undefined undefined undefined
Checking for undefined
You can check if a variable is undefined using strict equality (===) or the typeof operator:
let x;
// Method 1: Direct comparison (recommended)
if (x === undefined) {
console.log("x is undefined");
}
// Method 2: Using typeof (safer for undeclared variables)
if (typeof x === "undefined") {
console.log("x is undefined");
}
// Testing with different values
let a = null;
let b = 0;
let c = "";
let d;
console.log("null === undefined:", null === undefined);
console.log("0 === undefined:", 0 === undefined);
console.log('"" === undefined:', "" === undefined);
console.log("declared but unassigned === undefined:", d === undefined);
x is undefined x is undefined null === undefined: false 0 === undefined: false "" === undefined: false declared but unassigned === undefined: true
Browser Example
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>JavaScript undefined Property</title>
<style>
body {
font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
}
.result {
font-size: 18px;
font-weight: 500;
color: red;
margin: 10px 0;
}
</style>
</head>
<body>
<h1>JavaScript undefined Property</h1>
<div class="result"></div>
<button class="btn">Check undefined Variable</button>
<h3>Click the button to check if variable age is defined</h3>
<script>
let resultDiv = document.querySelector(".result");
let age; // declared but not assigned
document.querySelector(".btn").addEventListener("click", () => {
if (age === undefined) {
resultDiv.innerHTML = "The variable 'age' is undefined (declared but not assigned)";
} else {
resultDiv.innerHTML = "The variable 'age' is defined with value: " + age;
}
});
</script>
</body>
</html>
undefined vs null vs false
| Value | Type | Meaning |
|---|---|---|
undefined |
undefined | Variable declared but not assigned |
null |
object | Intentional absence of value |
false |
boolean | Boolean false value |
Best Practices
Always initialize variables to avoid undefined values, and use strict equality (===) when checking for undefined to avoid type coercion issues.
Conclusion
undefined indicates uninitialized variables or non-existent properties. Use strict equality for reliable undefined checks and initialize variables to prevent unexpected undefined values.
