JavaScript Basics: Truthy and Falsy values in JavaScript

myogeshchavan97

Yogesh Chavan

Posted on August 1, 2020

JavaScript Basics: Truthy and Falsy values in JavaScript

Do you know that Javascript has a set of pre-defined falsy values?

Truthy and Falsy values are the non-boolean values that are coerced to true or false when performing certain operations.

The following are the only six values that are considered as falsy values in JavaScript.

  • false
  • undefined
  • null
  • ""
  • NaN
  • 0

Anything that is not present in the above list is considered as truthy.
So if you are writing an if condition, you donā€™t need to check if something is empty or undefined or null. It will automatically be considered as false.



const value = "";
// this condition is enough and no need to check value == ""
if(value) {
  console.log(value); // This code will not be executed
}

const nullValue = null;
// this condition is enough and no need to check value === null
if(nullValue) {
   console.log(nullValue); // This code will not be executed
}

let sum;
// this condition is enough and no need to check value === undefined
if(sum) {
   console.log(sum); // This code will not be executed
}


Enter fullscreen mode Exit fullscreen mode

An easy way of checking if a value is truthy or falsy is by passing it to the Boolean constructor function.



Boolean(NaN) // false
Boolean([]) // true
Boolean({}) // true


Enter fullscreen mode Exit fullscreen mode

You can turn any value into its truthy or falsy boolean value by flipping it twice:



let number1;
console.log(!!number1); // false

const number2 = 10;
console.log(!!number2); // true

const name1 = 'Tim';
console.log(!!name1); // true

const name2 = '';
console.log(!!name2); // false

const nullValue = null;
console.log(!!nullValue); // false


Enter fullscreen mode Exit fullscreen mode

This has some practical applications too.


Applying Truthy and Falsy Values

Suppose, you are parsing a CSV file and each column contains comma-separated names, numbers, and some empty values. There are some blank spaces, so when you parse each line, you might get something like this:



const parsedData = 'David,Mike,Tim,,John, 10,, Jonathan';


Enter fullscreen mode Exit fullscreen mode

And you want to print only values which are valid, so in this case you can do something like this



const parsedData = 'David,Mike,Tim,,John, 10,, Jonathan';
console.log(
 parsedData
  .split(',')
  .map(value => value.trim())
  .filter(value => !!value)
  .join(' ')
); // David Mike Tim John 10 Jonathan


Enter fullscreen mode Exit fullscreen mode

Which can be further simplified as



const parsedData = 'David,Mike,Tim,,John, 10,, Jonathan';
console.log(
 parsedData
  .split(',')
  .map(value => value.trim())
  .filter(Boolean)
  .join(' ')
); // David Mike Tim John 10 Jonathan


Enter fullscreen mode Exit fullscreen mode

If you have an array of different values like



const arr = [10, 20, "raj", 0, [], '', NaN, 3, undefined, 50, null, 89];


Enter fullscreen mode Exit fullscreen mode

Then, you can get valid values as



const arr = [10, 20, 'raj', 0, [], '', NaN, 3, undefined, 50, null, 
89];
console.log(arr.filter(Boolean)); //[ 10, 20, 'raj', [], 3, 50, 89 ]


Enter fullscreen mode Exit fullscreen mode

Don't forget to subscribe to get my weekly newsletter with amazing tips, tricks and articles directly in your inbox here.

šŸ’– šŸ’Ŗ šŸ™… šŸš©
myogeshchavan97
Yogesh Chavan

Posted on August 1, 2020

Join Our Newsletter. No Spam, Only the good stuff.

Sign up to receive the latest update from our blog.

Related