Picture this

You need to check if an element exists on a page, let's take a look at this example:

You have a list of cool bugs on your website, but you want to check if the ladybug element is present on a specific instance (maybe the user initially chooses a bunch of insects from a list)

js function doesLadybugExist() { return (document.getElementById("lady-bug")); // This will either return the element, or null }

This looks alright... but, this will either return the element, or it will return null, which is not wrong, but in this example its not desired, we want to see if the ladybug exists

Lady bugs are !! cool

js function doesLadybugExist() { return (!!document.getElementById("lady-bug")); // This will either true if it exists, or false } Take a closer look and see the !!

This is great because it returns a boolean value for us to if the user likes ladybugs or not. Success!

But not so fast. How does this work?

A quick google search will tell you that !! does not exist in a java context. It is simply the ! operator used twice.

What this does is it converts a non-boolean to an inverted boolean, meaning any truthy values get evaluated to true, and any falsy values get evaluated to false (in a boolean context)

All values are truthy unless they are defined as falsy

Below are the values that are falsy in Javascript according to MDN

No. | Value ---|--- 1. | false 2. | null 3. | undefined 4. | 0 (note: the string '0' evaluates to true) 5. | NaN 6. | '' 7. | document.all

Using !! is a clean, and easy way of comparing the state of an element on your DOM against a boolean value without having to worry about type-casting and other conversion methods.

And, lastly, do not not leave a like and a unicorn ;)