What are Truthy and Falsy Values?
In JavaScript, when you use a value inside a condition, like in an if
statement, JavaScript automatically converts that value to either true
or false
behind the scenes.
So, even if you're not using a true
or false
value directly, JavaScript decides to treat this value as true
or as false
.
Based on that decision, your condition either runs (if the value is truthy) or skips (if the value is falsy).
That doesn’t mean the value is exactly true
or false
, but JavaScript treats it like that when checking conditions.
Truthy Values
Anything that is not falsy is considered truthy.
Some common truthy values are:
true
- Any number except 0 (like
1
,-5
,3.14
) - Any non-empty string (like
"hello"
,"false"
,"0"
) - Dates
- Symbols
- BigInt values other than
0n
- Arrays (
[]
) - Objects (
{}
) - Functions
Examples of Truthy Values:
if (true) {
console.log("This will run!");
}
if ("hello") {
console.log("This will run!");
}
if (123) {
console.log("This will run!");
}
if (123456789n) {
console.log("This will run!");
}
if ([]) {
console.log("This will run!");
}
All these values are treated as true, so the code runs.
Falsy Values
Falsy values are values that evaluate to false when used in conditions.
Some common falsy values are:
false
0
and-0
0n
""
(Empty string)null
undefined
NaN
Examples of Falsy Values:
if (false) {
console.log("This will not run!");
}
if (0) {
console.log("This will not run!");
}
if ("") {
console.log("This will not run!");
}
if (null) {
console.log("This will not run!");
}
if (NaN) {
console.log("This will not run!");
}
All these values are treated as false, so the code will not run.
Examples
Example 1: Default value using OR operator
let username;
let displayName = username || "Guest";
console.log(displayName); // Output: "Guest"
Here,
- The variable
username
is declared but not defined, which means it'sundefined
andundefined
is a falsy value. - The
||
(OR) operator checks ifusername
has a truthy value. - Since it's not a truthy value, it picks the next value,
"Guest"
. - So,
"Guest"
gets assigned todisplayName
.
Example 2: Check for an empty string
let name = "";
if (!name) {
console.log("Name is required");
}
Here,
- The variable
name
is an empty string""
, which is falsy. !name
means "not falsy", which becomestrue
in this case.- So, the code inside the
if
block runs and prints"Name is required"
.
Example 3: Empty array is truthy
let items = [];
if (items) {
console.log("This will run!");
}
Here,
- The variable
items
is an empty array. - Even though it’s empty, arrays are always truthy in JavaScript.
- So, the condition is true, and
"This will run!"
is printed.
Example 4: Short-circuiting with AND operator
let isLoggedIn = true;
isLoggedIn && console.log("Welcome back!");
Here,
isLoggedIn
istrue
(truthy), so the right side runs and printsWelcome back!
.- If
isLoggedIn
werefalse
, nothing would happen becausefalse && anything
stops right away.
Example 5: Using falsy value in a condition
let score = 0;
if (!score) {
console.log("No score yet!");
}
Here,
0
is a falsy value, so!score
becomestrue
."No score yet!"
is printed.
Example 6: Use OR operator to set the default text
let input = "";
let message = input || "Please enter something!";
console.log(message); // Output: "Please enter something!"
Here,
input
is an empty string, which is a falsy value.- So the default
"Please enter something!"
is used.
Example 7: Truthy object check
let user = {};
if (user) {
console.log("User exists!");
}
Here,
- The variable
user
is an empty object. - Even though it’s empty, objects are always truthy in JavaScript.
- So
"User exists!"
is printed.
Example 8: Double negation to get the real boolean
let value = "hello";
let isTruthy = !!value;
console.log(isTruthy); // Output: true
Here,
- "hello" is a truthy value.
- The first
!value
turns it intofalse
. - The second
!
turns it back totrue
. - This is a common trick to convert any value to its boolean form.
Example 9: "false" is truthy
if ("false") {
console.log("This will run!");
}
Here, even though it says "false", it’s a non-empty string, so it’s truthy.
Example 10: "0" is truthy
if ("0") {
console.log("This will run!");
}
Here,
- "0" is a string containing the character zero.
- In JavaScript, any non-empty string is truthy, even if it looks like a number.
- Even though
0
(the number) is falsy,"0"
(a non-empty string) is truthy. - That means the condition if ("0") is true, and the code inside the block will run.
Tip
If you're ever unsure whether a value is truthy or falsy, use:
console.log(Boolean(value));
Or the shorter version:
console.log(!!value);
This will convert the value into its actual boolean form.