How null is converted to Boolean in JavaScript?

Front End Technology Javascript Web Development

In JavaScript null is a predefined keyword that represents an empty value or unknown value of no value. The data type of null is an object. In this article, we will learn how to convert null into Boolean using multiple approaches which are following.

Using the Boolean function
Using the !! operator

Using the Boolean function

The Boolean function is used to get the Boolean value (true or false) of any variable, condition, or object. To convert the null into Boolean we just need to pass the null in the Boolean function.

Syntax

Boolean(null)

Example 1

In this example, we created a variable named bool and passed the null inside the Boolean function and stored the returned value to bool, and printed the result.


<html>
<head>
   <title> Example: Convert null to Boolean</title>
</head>
<body>
   <p> Convert null to Boolean using the Boolean() Method </p>
   <p id ="output"></p>
   <script>
      let bool = Boolean(null)
      document.getElementById("output").innerHTML += bool +"<br>";
      document.getElementById("output").innerHTML += typeof bool
   </script>
</body>
</html>

Example 2

Avoid using new Boolean()

In the below example we will demonstrate why we should not use the new Boolean() to convert null to Boolean. As when we use the new Boolean(), it returns an object, not the Boolean.


<html>
<head>
   <title> Example: Convert null to Boolean</title>
</head>
<body>
   <p> Convert null to Boolean using the Boolean() Method </p>
   <p id ="output"></p>
   <script>
      let bool = new Boolean(null)
      document.getElementById("output").innerHTML += bool +"<br>";
      document.getElementById("output").innerHTML += typeof bool
   </script>
</body>
</html>

Using the !! operator

The Logical not operator followed by another Logical not operator is a simple and elegant method to convert the null to Boolean. The first logical operator converts the value to the Boolean and another logical operator reverses the value returned by the first operator.

Syntax

!!object

Let's break down the operator into two-part with an example:

Example 3

In this example, we created a variable named x and stored Tutorials point to it and created another variable named x1 in which we stored the value of !x, here the logical operator converts the value to the Boolean and another operator(x2) reverses the result given by the first operator(x1).


<html>
<body>
   <p> Convert string to Boolean using the !! Operator </p>
   <p id ="output"></p>
   <script>
      var x = "Tutorials Point"
      var x1 = !x; // false
      var x2 = !!x; // true
      document.write(x1 + " <br>")
      document.write(x2)
   </script>
</body>
</html>

Example 4

In this example, we will convert the null to Boolean.


<html>
<head>
   <title> Example: Convert null to Boolean</title>
</head>
<body>
   <p>Convert null to Boolean using the !! Operator</p>
   <p id ="output"></p>
   <script>
      let bool = !!null;
      document.getElementById("output").innerHTML += bool +"<br>";
      document.getElementById("output").innerHTML += typeof bool
   </script>
</body>
</html>

As we have mentioned two methods here are high performance. The Boolean function is widely used by some developers while the !! operator method seems a little non-readable and some developers do not know about it. If we talk about the speed of both of the solutions the !! operator is a little faster than the Boolean function.

Saurabh Jaiswal

Updated on: 11-Aug-2022

5K+ Views

Kickstart Your Career

Get certified by completing the course

Get Started