JavaScript Truthy and Falsy Values
Tags: javascript, beginners, codequality
Published: 2020-08-22 17:44:55

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
```js
    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
```js
    let a = false
    console.log(a)
    console.log(Boolean(a))
```
e.g 2
```js
    let a = 'false'
    console.log(a)
    console.log(Boolean(a))
```
In e.g 1 you get 
```js
    false
    false
```
In e.g 2 you get 
```js
    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](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/BigInt), when used as a boolean, follows the same rule as a Number
- `''`
- `null`
- `undefined`
- `NaN`
```js
    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.
```js
    // 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.
```js
    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
```js
    if (a == false) // ...
    // runs if a is false, 0, -0, 0n, '', or []
    // where [] should be truthy not falsy
```
Use
```js
    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](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/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](https://twitter.com/KindnessOsumgba), let's connect.