Truthy and Falsy Values
In the previous lecture, we talked about type conversion and type coercion to numbers and strings, but I didn't mention booleans. I didn't because we need to learn the concept of truthy and falsy values first.
Falsy values are values that are not exactly false but will become false whenever we try to convert them into a boolean.
There exist only five falsy values in JavaScript :
Of course, false
itself is already false, so we do not need to include it in the list of falsy values. All of these five values will be converted to false if we try to convert them to a boolean. They are not exactly false but they will become when converted to a boolean.
That's the definition of falsy values. Everything else are so-called truthy values .i.e. values that will be converted to true. For example, any number that is not zero or any string that is not an empty string will be converted to true
when we attempt to convert it to a boolean.
Let's consider the below code snippet. Just like with numbers and string, we can use the Boolean function to convert to a boolean value.
console.log(Boolean(0)); // Result ==> false
console.log(Boolean('')); // Result ==> false
console.log(Boolean(undefined)); // Result ==> false
console.log(Boolean('Jacob')); // Result ==> true
console.log(Boolean(3)); // Result ==> true
As we can see and as we said previously, the number zero results to false, the empty string and undefined did the same as zero, but we can see that both the string 'Jacob'
and the number three resulted to true. This is why we said that any string that is not an empty string or number that is not zero is a truthy value.
I've actually never used this function. This was just to show you the concept of truthy ans falsy values. In practice, the conversion to boolean is always implict; not explicit. In other words, it's always type coercion that JavaScript does automatically behind the scenes.
JavaScript does type coercion to booleans in two scenarios. First when using logical operators and second in a logical context, like in the condition of an if/else
statement. For example :
const bankAccount = 1000
if(bankAccount) {
console.log('You still have some money !')
} else {
console.log('You have spent it all !!')
}
If you try to execute this code, you will notice that the output is You still have some money !
. This happens because bankAccount
is a number, this number is 1000
, but in the logical context of an if/else
statement condition, JavaScript will try to coerce any value into a boolean. So, no matter what we put in as condition in an if/else
statement, if it is not a boolean, JavaScript will try to convert it to a boolean, and this happens using the truthy and falsy values rules discussed at the beginning.
Knowing that bankAccount
is 1000
and that 1000
is a truthy value, so in this logical environment, the number 1000
will be converted to true
, just like what we had when we did console.log(Boolean(3))
. That's exactly what happens in if(bankAccount)
. bankAccount
being converted to true
, makes the if block
to be executed and providing us with the expected output in the console.
If we now try to change the value of bankAccount
to something else like zero, this means the condition will be false, and so the else
block will be executed.
To finish this lecture, let's see this last example to actually make sure you understand. An example to check if a variable exists.
let apples;
if(apples) {
console.log('There are some apples remaining')
} else {
console.log("There isn't any apples left")
}
If you execute it, the result will be There isn't any apples left
. Can you explain to yourself why it works this way? If you don't, then let me explain it again.
We know that apples
is undefined
on the highlighted line because no value has been assigned to it, and we know that undefined
is a false value and therefore, the apples
variable in the if condition in this logical context will automatically be converted to a boolean.
Knowing that apples
is undefined
and undefined
is a false value, the else block
will be executed.