JavaScript Truthy & Falsy — What is the Output?
This is a daily Javascript challenge from the CodeShot archive. Practice your knowledge of Boolean Conversion Zero String and improve your technical interview readiness.
console.log(Boolean(0))
console.log(Boolean(""))
console.log(Boolean("0"))
Detailed Explanation
Why This Question Matters
If you've spent any time in JavaScript, you've probably run into a bug where an if statement didn't execute when you thought it should, or it triggered when it absolutely shouldn't have. Usually, the culprit is truthiness and falsiness.
JavaScript is a loosely typed language. It doesn't force you to be explicit about types, which is great for speed but a nightmare for predictability. When you wrap a value in Boolean(), you're asking JS to perform a type conversion. The problem is that the rules for what is "true" and what is "false" aren't always intuitive, especially when you start mixing numbers and strings.
Understanding this isn't just about passing a technical interview; it's about avoiding those "why is this happening?" moments during a midnight debugging session.
Understanding the Code
Let's look at the snippet:
At first glance, a beginner might see 0 and "0" and think they are the same thing. After all, they both represent the digit zero. But in JavaScript, the type of the value changes everything.
Line 1: Boolean(0)
Here, we have the number 0. In JavaScript, the number zero is explicitly defined as a "falsy" value. When you pass it into the Boolean constructor, it returns false.
Line 2: Boolean("")
This is an empty string. Just like the number zero, an empty string is one of the few values in JS that is considered falsy. Result: false.
Line 3: Boolean("0")
Now it gets interesting. This isn't a number; it's a string containing the character zero. In JavaScript, any non-empty string is truthy. Even if the string contains the word "false", the number "0", or just a single space " ", it's still a string with length. Because it's not empty, it evaluates to true.
Finding the Correct Answer
If you were looking at multiple-choice options, the correct answer is Option B: false, false, true.
Here is the logic breakdown again:
- 0 $\rightarrow$ Number $\rightarrow$ Falsy $\rightarrow$ false
- "" $\rightarrow$ Empty String $\rightarrow$ Falsy $\rightarrow$ false
- "0" $\rightarrow$ Non-empty String $\rightarrow$ Truthy $\rightarrow$ true
The "trick" here is the distinction between the number 0 and the string "0". If you're coming from a language like Python, this might feel familiar, but if you're new to programming, the idea that a "zero" can be true is a bit of a head-scratcher.
Common Mistakes Developers Make
The most common mistake is assuming that the *content* of the value determines the boolean result.
Developers often write code like this:
In this case, the developer thinks, "If the user entered 0, it's basically nothing, so the
!userInput (not truthy) will trigger the error message."
But it won't. Since "0" is a non-empty string, it's truthy. !truthy becomes false, and the error message never prints. This is how silent bugs creep into your frontend validation logic.
Another edge case is null and undefined. Both are falsy. However, if you accidentally initialize a variable as an empty array [] or an empty object {}, both are truthy. This trips up juniors constantly. They expect an empty list to be "false," but in JS, objects and arrays are always truthy, even if they're empty.
Real-World Usage
You won't actually see Boolean() written out this often in production code. Instead, you'll see "implicit coercion."
When you write if (value), JavaScript internally calls the same logic as Boolean(value).
Here is a practical example of where this matters. Imagine you're fetching a count of notifications from an API:
In the example above, if the count is 0, the badge won't show because 0 is falsy. But what if the API returns the count as a string "0"? Suddenly, your badge shows up for a user who has zero notifications.
To fix this, experienced devs usually check for specific types or use strict equality:
Key Takeaways
- Falsy values in JS are: false, 0, -0, 0n (BigInt zero), "" (empty string), null, undefined, and NaN.
- Everything else is truthy, including "0", "false", [] (empty array), and {} (empty object).
- Be careful with strings. A string with any character in it—even a space—is true.
- When in doubt, be explicit. Instead of relying on truthiness, check if a value is undefined or null explicitly to avoid weird coercion bugs.
Why this matters
Understanding Boolean Conversion Zero String is crucial for passing technical interviews. In real-world applications, this concept often leads to subtle bugs if not handled correctly. For more details, you can always refer to the official MDN Documentation.