How null is converted to Number in JavaScript?



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 Number() Method
  • Using Logical OR (||)
  • Using the ~~ operator
  • Using Ternary Operator
  • Concatenating null with a boolean value

Using the Number() Method

The Number() method in JavaScript is used to convert a value into a number. If the value is not convertible, then it will return NaN. To convert the null into a Number we pass the "null" as an argument to the Number() method.

Syntax

Following is the syntax to convert "null" to a number using the Number() method:

Number(null)

It returns 0 when null is passed as an argument to this method.

Example 1

In the example below, we convert null to Number using the Number() method. We also check the type of after conversion to number.

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

Using Logical OR (||)

The or operator is represented by the || sign in JavaScript. To convert the null into a number we use the OR operator with null and any number and the OR operator will return that Number.

Syntax

null || number;

Example 2

In this example, we created a variable num and assigned the value as null || 0. It converts the null to a number with value 0.

<html> <head> <title>Example: Convert null to Number</title> </head> <body> <p>Convert null to Number using the Logical OR (||)</p> <p id ="output"></p> <script> let num = null || 0; document.getElementById("output").innerHTML += num +"<br>"; document.getElementById("output").innerHTML += typeof num </script> </body> </html>

Using the ~~ Operator

The ~~ operator is also called the double-tilde or double bitwise not operator. It is used to floor the positive numbers which is a short form of the Math.floor() method but only for positive numbers. To convert the null to a Number we simply use this operator in front of the null.

Syntax

~~number

Example 3

In this example, we are assigning null to the variable num and printing the value of ~~num.

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

Using the Ternary Operator

The conditional operator or ternary operator first evaluates an expression for a true or false value and then executes one of the two given statements depending upon the result of the evaluation.

Syntax

null ? null : number

Example 4

In the given example it is clear how to convert null to Number using Ternary Operator.

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

Concatenating null with a boolean value

When we concatenate null with a boolean value i.e., true or false, the result is a number type. We can apply this trick to convert null to a number. For this, we concatenate null with false using the "+" operator.

Syntax

var num = null+false

Example

In the example below, we convert the null to number. We concatenate null with false using + operator. The resultant value of null as number is zero.

<html> <head> <title> Example: Convert null to Number</title> </head> <body> <p>Convert null to Number by concatenating null with a boolean value</p> <p id ="output"></p> <script> let num = null + false; document.getElementById("output").innerHTML += num +"<br>"; document.getElementById("output").innerHTML += typeof num </script> </body> </html>

As we have mentioned four methods to convert null to Number, you can use any of the methods according to your need, the third method (using the ~~) is the fastest method but it makes our code a little less readable, if readability is not the concern then you can use this method other-wise ternary operator method and the logical operator methods are best when it comes to readability.


Advertisements