Truthy vs falsy values in JavaScript

Knowing if a value is a truthy or falsy is important in your JavaScript code because often JavaScript will convert values to true or false booleans in conditionals and loops.

For example, you might have some code like this:

if (access) {
 // run some code
}

If access is a truthy value, the code will run. If it's a falsy value, the code won't run.

Truthy vs. falsy is more than true vs. false, so let's start with falsy values and get to grips with this important concept.

Falsy values in JavaScript

A falsy value is considered false when converted to a boolean in JavaScript.

I'm starting with falsy values because there are only 8 of those. And once you know what a falsy value is in JavaScript, it's easier to know what a truthy value is!

So here are the falsy values in JavaScript:

• false
• null
• undefined
• 0
• -0
• 0n
• ""
• NaN

false is first on the list. It's pretty obvious this is a falsy value since it's literally in the name. This might be the first value you think of then you think of a falsy value.

null is also a falsy value.

undefined is a falsy value. It's not usually something you would set yourself - I certainly try not to define undefined, since that seems like a contradiction!

0 is the number zero, and it's a falsy value.

-0 is the number minus zero. I don't know that it really exists - but it's the same as zero (-0 === 0). Anyway, it's also the same as zero in that it is a falsy value.

0n is like the number zero, but it's the BigInt version of 0. It's also a falsy value.

"" is an empty string, and it's also a falsy value in JavaScript.

NaN is a number, but it's also not a number! NaN does not equal NaN, but it is a falsy value.

Truthy values in JavaScript

A truthy value is considered true when converted to a boolean in JavaScript.

Now you know what falsy values are in JavaScript, it's easy to know what truthy values are - everything else!

If a value isn't one of those eight falsy values, it's a truthy. An object, a string, any number other than zero (or NaN if you consider that to be a number!), a function, an array - all truthy values!

How to check if a value is truthy or falsy in JavaScript

You can check if a value is truthy or falsy when JavaScript coerces the value to a boolean. This is most often seen in conditionals like an if...else statement.

Let's use this in a function called truthyOrFalsy to check some of the values we have looked at so far.

function truthyOrFalsy(x) {
  if (x) {
    console.log(`${x} is truthy!`);
  } else {
    console.log(`${x} is falsy!`);
  }
};

truthyOrFalsy(true); // true is truthy!
truthyOrFalsy(false); // false is falsy!
truthyOrFalsy(""); //  is falsy!
truthyOrFalsy(0); // 0 is falsy!
truthyOrFalsy(" "); //  is truthy!
truthyOrFalsy(1); // 1 is truthy!
truthyOrFalsy("hello world"); // hello world is truthy!
truthyOrFalsy("false"); // false is truthy!
truthyOrFalsy({}); // [object Object] is truthy!
truthyOrFalsy([]); //  is truthy!
truthyOrFalsy(NaN); // NaN is falsy!
truthyOrFalsy(undefined); // undefined is falsy!
truthyOrFalsy(-1); // -1 is truthy!
truthyOrFalsy(-0); // 0 is falsy!
truthyOrFalsy(null); // null is falsy!

Another good way to convert a value to true or false is with the logical NOT ! operator. This coerces a value in JavaScript to false if it is truthy, or true if it's falsy.

While that's not what we want, it does coerce a value into a boolean. So a common JavaScript trick* is to use it twice !! (let's call it the logical NOT-NOT operator 😆) to convert it back to the boolean it does convert to - and check if a value is truthy or falsy.

console.log(!!true); // true
console.log(!!false); // false
console.log(!!1); // true
console.log(!!0); // false
console.log(!!""); // false
console.log(!!"hello"); // true
console.log(!!undefined); // false
console.log(!!NaN); // false
console.log(!!{ name: "my object" }); // true

*I recently used this trick to fix react rendering 0 in conditionals.

Truthy vs falsy gotchas!

Here are a few truthy vs. falsy facts that might catch you out in JavaScript.

An empty string is a falsy. But an empty object or an empty array is a truthy! Since an empty string is falsy, I thought maybe an empty object or empty array would be too - but they are not - they are truthy. I think it's because objects and arrays are not immutable primitive values (like a string).

The number 0 is a falsy. But -1 is a truthy! This caught me out at first because I thought 0 is falsy because it's not a positive number, so I kind of assumed negative numbers will be falsy too. But I was wrong - negative numbers are truthy (apart from -0).

The string "false" is a truthy! This one might seem pretty obvious, but it can cause bugs, especially when sending true or false booleans as a query string to your server.

If you have a variable that should be false but it's not behaving like one, you can console.log(typeof yourVariable) to make sure it's a boolean and not a string. Here's how I convert "true" and "false" strings back to booleans in Node.js with Express.

"0" == false but "0" is not a falsy. That's because the == operator is a loose equality comparison, and will convert the string "0" to the number 0 which is a falsy! That doesn't happen with === strict equality, where "0" === true.

Now you can handle the truth(y)!