You will be aware of the Logical NOT (!) operator, which is used to negate the expression. In this article, we will see what is !! (not not) operator and its uses.
Truthy and Falsy
Before understanding the not not (!!) operator, we need to understand what is truthy and falsy in JavaScript. Truthy value is a value that is considered true in a Boolean context. That means, if we have an expression as if("John")or if(1) then this will evaluate to true. Hence, a non-empty string, non-zero number, etc are considered as truthy.
Similarly, falsy is some value that evaluates to false. Examples are 0, '' "", null, undefined etc.
Examples of truthy
The following are the expressions that will evaluate to true. Hence all the values inside the if conditions are truthy values.
if (true)
if ({})
if ([])
if (42)
if ("0")
if ("false")
if (new Date())
if (-42)
if (12n)
if (3.14)
if (-3.14)
if (Infinity)
if (-Infinity)
Examples of falsy
Following values are considered as falsy in JavaScript:
- false
- 0
- -0
- '', ""
- null
- undefined
- NaN
A complete list can be found here.
The use of !! operator
Let's say we have a function called getProductDetails which returns the product details when a valid product id is passed. When an invalid product id is passed it may return an empty string or undefined. So the code for processing the product details received as a response would look like this:
const product = getProductDetails(123)
if (product !== undefined || product !== "") {
// Process product details
}
With the help of not not operator, we can shorten this as follows:
const product = getProductDetails(123)
if (!!product) {
// Process product details
}
!! is not an operator but two logical NOT (!) operators.
The first one (in the right) will convert the operand (the value under evaluation) to the negated boolean and the second ! will negate the boolean value again to get the boolean representation of the operand.
That is, !"John" will be evaluated to false and !false will be evaluated to true.
In case of a falsy value, !0 will be evaluated to true, and !true will be false.
One interesting thing to note is that !!new Boolean(false) is true because new Boolean(false) will create an object, which is truthy even though it contains a false value.
Top comments (5)
I find that the eslint manpage for
no-extra-boolean-castquite neatly outlines when!!is useful and when it is not.And because I'm nitpicky lately:
!!is not an operator. It's two operators. This is rather important to distinguish when talking about programming linguistics and parsers.One of the fun truthy-falsy experiments:
If you're checking the truthiness or falsiness of a value, there is absolutely zero point using
!!What's the benefit of
if(!!product)vsif(product)?There is no !! operator at all.