What is the !! (not not) operator in JavaScript?

In JavaScript, the !! (not not) operator is used to coerce a value to its boolean equivalent. It is typically used to convert a truthy or falsy value to a true or false boolean value.

Understanding Truthy and Falsy Values

Before diving into the !! operator, it's important to understand truthy and falsy values in JavaScript. In JavaScript, every value can be evaluated as either true or false in a boolean context.

Truthy values are values that are considered true when evaluated in a boolean context. Examples of truthy values include:

  • Non-zero numbers, such as 1, -1, 2.5, etc.
  • Non-empty strings, such as "hello", "true", etc.
  • Objects and arrays
  • The value true

On the other hand, falsy values are values that are considered false when evaluated in a boolean context. Examples of falsy values include:

  • The number 0
  • The empty string ("")
  • The value null
  • The value undefined
  • The value false
  • The value NaN

Now that you understand truthy and falsy values, let's explore how the !! operator works.

The !! Operator

The !! operator, also known as the "not not" operator, is used to convert a value to its boolean equivalent. It works by first applying the logical NOT operator (!) to the value, and then applying it again. This effectively casts the value to a boolean.

Here's an example:

            
                const value = "hello";
                const booleanValue = !!value;
                console.log(booleanValue); // Output: true
            
        

In this example, the variable value is assigned a truthy value ("hello"). When we apply the !! operator to value, it first converts it to its boolean equivalent by applying the logical NOT operator (!). Since value is truthy, the logical NOT operator converts it to false. The second application of the logical NOT operator then converts it back to true, resulting in the variable booleanValue being assigned the value true.

The !! operator is often used in conditional statements or to ensure that a value is evaluated as a boolean. For example:

            
                const value = "hello";
                if (!!value) {
                    console.log("Value is truthy");
                } else {
                    console.log("Value is falsy");
                }
            
        

In this example, the !! operator is used to check if the variable value is truthy or falsy. If it is truthy, the message "Value is truthy" is logged to the console. Otherwise, the message "Value is falsy" is logged.

Using the !! Operator in Practice

Now that you understand how the !! operator works, let's look at a real-world example where it can be useful.

Consider the following code snippet:

            
                this.vertical = vertical !== undefined ? !!vertical : this.vertical;
            
        

In this example, the !! operator is used to ensure that the value of the variable vertical is coerced to its boolean equivalent. If vertical is not undefined, it is converted to a boolean value using the !! operator. Otherwise, the expression evaluates to this.vertical, which may already be a boolean value.

This can be useful in scenarios where you want to provide a default value for a boolean property, but also allow the option to explicitly set it to a truthy or falsy value. By using the !! operator, you can ensure that the value is always evaluated as a boolean, regardless of its initial type.

Conclusion

The !! (not not) operator in JavaScript is used to convert a value to its boolean equivalent. It works by first applying the logical NOT operator (!) to the value, and then applying it again. This essentially casts the value to a boolean. The !! operator is commonly used to convert truthy or falsy values to true or false boolean values, and is especially useful in conditional statements or when providing default values for boolean properties.