DEV Community

Cover image for JavaScript Truthy and Falsy Values
Osumgba Chiamaka
Osumgba Chiamaka

Posted on

JavaScript Truthy and Falsy Values

Truthy and falsy values are misunderstood by lots of people to mean only values that have true or false as their values. In this article you would get to understand the difference between these two concepts.

Prerequisite

  • Basic Knowledge of JavaScript

True and False Variable Values

 let a = false let b = true 

In Javascript you can assign true or false to a variable. The variables in the sample code above have true or false assigned to them. So wherever you call this variables, either true or false will be displayed unless the are re-assigned.
Follow me, let do some coding experiments.

e.g 1

 let a = false console.log(a) console.log(Boolean(a)) 

e.g 2

 let a = 'false' console.log(a) console.log(Boolean(a)) 

In e.g 1 you get

 false false 

In e.g 2 you get

 false true 

A value being truthy or falsy goes beyond having true or false as it's value. In this article true/false values means values that have either true/false values assigned to them. Then what does it mean for variables to be truthy or falsy.

Truthy and Falsy Values

Falsy Values

Falsy values are values that JavaScript's built-in type coercion converts to false or in a Boolean context are considered false. In simple terms we could say, variables that do not have values or do not exist but it’s more than that. Below are a list of all falsy values

  • false
  • 0 Both positive and negative
  • 0n BigInt, when used as a boolean, follows the same rule as a Number
  • ''
  • null
  • undefined
  • NaN
 let a = false let b = 0 let c = -0 let d = 0n let e = '' let f = null let g = undefined let h = NaN console.log(Boolean (a)) console.log(Boolean (b)) console.log(Boolean (c)) console.log(Boolean (d)) console.log(Boolean (e)) console.log(Boolean (f)) console.log(Boolean (g)) console.log(Boolean (h)) 

The above shows that all the above are falsy. In your JavaScript algorithm if you are checking and using truthy/falsy values, then make sure that you are not using any of the falsy values in your if algorithm.

e.g The sample code below is an algorithm to check if a variable is a number or not a number.

 // using the variables you have declared above => a, b, c, d, e, f, g, h const printType = (value) => { if (!value){ return 'does not exist, it is falsy' } return Number.isInteger(value) ? `${value} is a number` : `${value} is a not a number` } console.log(printType(a)) 

The above code will always return does not exist, it is falsy as long as it evaluates the value to be falsy in this case it includes both 0 and '' which you might want to use in your algorithm. 0 is a number and should return 0 is a number, but because it's falsy and we are checking for falsy values in our code, it won't be evaluated that way, same goes for ''.

The block of code below checks if a value is falsy. It will return true if the value is falsy, so anything inside this block of code will be executed as long as the value is falsy.

 if (!value){ ... } 

If your code makes use of falsy/truthy values, it saves you the stress of having to check for undefined, null, NaN individually.

e.g
Instead of

 if (a == false) // ... // runs if a is false, 0, -0, 0n, '', or [] // where [] should be truthy not falsy 

Use

 if (!a) // ... // runs if a is false, 0, -0, 0n, '', NaN, null or undefined 

Truthy Values

Anything asides what’s mentioned above is truthy. Simply any variable with a value is truthy.
Below are some truthy values

  • true
  • {} An object (whether empty or not)
  • [] An array (whether empty or not)
  • 25 Numbers (whether positive or negative)
  • 'true' Non empty strings
  • 'false' Non empty strings
  • new Date() Date object
  • 12n BigInt, when used as a boolean, follows the same rule as a Number
  • Infinity

Conclusion

Hope you enjoyed the article. Truthy or Falsy values can be confusing, hope this article makes it clearer.

You can find me on Twitter, let's connect.

Top comments (2)

Collapse
 
functional_js profile image
Functional Javascript • Edited

Excellent analysis Osumgba.

Here's an example showing what's truthy and what's falsy in JavaScript:

//truthy values const aT = [true, {}, [], 25, 12n, "true", "false", new Date(), Infinity, Boolean(true), new Boolean(false), n => n ]; //falsy values const aF = [false, null, undefined, NaN, 0, -0, 0n, "", Boolean(false)]; logForeachParam(v => !!v, aT); logForeachParam(v => !!v, aF); 

after running it:

javascript truthy and falsy

logForeachParam Source Code:

gist.github.com/funfunction/42918a...

Collapse
 
osumgbachiamaka profile image
Osumgba Chiamaka

Nice example. Thanks for sharing.