JavaScript null is a primitive data type representing a deliberate non-value or the absence of any object value. It is often used to signify a variable or object property that has not been assigned a value.
Null is distinct from other primitive data types such as undefined, boolean, number, and string in that it is explicitly set by a programmer to indicate a non-value state. In contrast, other primitive data types represent specific values.
The value null is written with a literal: null. The null is not an identifier for a property of the global object, like undefined can be. Instead, null expresses a lack of identification, indicating that the variable points to no object.
Let’s see some examples of null.
const marvel = null
console.log(marvel)
The output is null.
Let’s remove the first line from the above code and see the output.
console.log(marvel)
Now, run the file in the node environment and see the output.
See, it throws an error. So when we assign the null value, it returns the null.
Proof that a null is an object in Javascript
What if we want to check the type of null? We have a function called typeof() that checks the type of any object or value. So, let’s check the typeof() null.
let marvel = null
console.log(typeof(marvel))
See the output.
So, null is an object in Javascript.
The null is falsy
In Javascript, null is the falsy value (i.e., “it evaluates to false if coerced to a boolean)”. Thus, the easiest way to check for null is to know that null evaluates to false in conditionals or if coerced to the boolean value.
const notSureifNull = null
if (notSureifNull) {
console.log("Not null")
}
else {
console.log("It could be null")
} // Could be null
for (let i = 0; null; i++) {
console.log("It won't run")
}
notSureifNull ? console.log("truthy value") : console.log("Falsy value")
Output
Could be null
Falsy value
When you run the above file, you will get this output, which does not comprehend null from the other falsy values.
Declaring null in JavaScript
We can assign a null object to any variable at the time of the declaration. Javascript variables come to life as the assignment operator, which helps us assign a particular value to the variable.
let data = null
console.log(data)
Output
null
In some programming languages, they don’t have to have an initial value assigned to them.
For example, the initial value for some variables might be Null.
Using null as part of a comparison
Let’s deep dive into the == or === equality operators to check for null.
Checking null values using the Double equality(==) operator
First, we will check null against some of the most returned values in Javascript with the (==) operator.
console.log("Is null equal to empty: ", null == "")
console.log("Is null equal to zero: ", null == 0)
console.log("Is null equal to false: ", null == false)
console.log("Is null equal to NaN: ", null == NaN)
console.log("Is null equal to 0n: ", null == 0n)
console.log("Is null equal to null: ", null == null)
console.log("Is null equal to undefined: ", null == undefined)
Output
Is null equal to empty: false
Is null equal to zero: false
Is null equal to false: false
Is null equal to NaN: false
Is null equal to 0n: false
Is null equal to null: true
Is null equal to undefined: true
In the above example, we have checked the null value against some of the most unexpected and erroneous values, and we have got the output, and some of them are still unexpected to us.
First, null in Javascript is not equal to empty. Then null is not equal to zero, and null is not equal to a false boolean value, although it is a falsy value; it is not equal to false.
Thus, despite the hard fact that null is a falsy value (i.e., it evaluates to false if coerced to a boolean), it still is not considered loosely equal to any of the other falsy values in JavaScript.
Then we checked against the NaN value, which is not equal to null either. Then 0n, which is not equal. But when it comes to null == null, it returns true.
That means two null values are the same. In fact, the only values that null is loosely equal to are undefined(undefined == null) and itself(null == null) because both return true.
Checking null values using triple equality(===) operator
If we have to ensure that we have precisely the null value, excluding any undefined values, using a triple equality === operator will do the trick. Now, check all the values above against the null with (===) strict equal to the operator.
console.log("Is null strict equal to empty: ", null === "")
console.log("Is null strict equal to zero: ", null === 0)
console.log("Is null strict equal to false: ", null === false)
console.log("Is null strict equal to NaN: ", null === NaN)
console.log("Is null strict equal to 0n: ", null === 0n)
console.log("Is null strict equal to null: ", null === null)
console.log("Is null strict equal to undefined: ", null === undefined)
Output
Is null strict equal to empty: false
Is null strict equal to zero: false
Is null strict equal to false: false
Is null strict equal to NaN: false
Is null strict equal to 0n: false
Is null strict equal to null: true
Is null strict equal to undefined: false
Now, you can see that null is not strictly equal to undefined. Therefore, it is better to handle null and undefined values, as both represent the absence of a value. That means checking for null is one of the few times in JavaScript that using == (double equality operator)is recommended, while otherwise === (strict comparison operator) is generally recommended.
Using null as a Value in JavaScript
In Javascript, we can pass null as a valid argument to the function. We can also add null as an item to the array. To provide that, let’s create a function called valueAsNull() and pass the two parameters to that function.
- new_element: This element will be added to the array if we pass an argument when calling the function.
- initiali_array: As a default parameter, the inital_array is null, but if we pass any argument explicitly, then it will return that array.
We will see a scenario in which we pass null as new_element and data as initial_array. That should be adding the null value to the initial_array.
function valueAsNull(new_element, initial_arr = null) {
if (initial_arr == null) {
initial_arr = []
}
if (initial_arr != null) {
initial_arr.push(new_element)
}
return initial_arr
}
data = [1, 2, 3, 4, 5]
console.log(valueAsNull(null, data))
Output
[ 1, 2, 3, 4, 5, null ]
We can add a null object as a value to an array using the push() method.
Javascript null basic math operations
Check out the basic math operations on null. Write the following code.
console.log(null / 7)
console.log(null % 7)
console.log(null - 7)
console.log(null + 7)
console.log(null * 7)
See the output.
Javascript undefined
JavaScript undefined is a primitive data type representing a value that is not defined or has not been initialized. It is often used to indicate the absence of a value or that a variable or object property has not been assigned a value.
The undefined is the property of a global object, i.e., the variable in the global scope. An initial value of undefined is the primitive value undefined. A variable that has not been assigned a value is of type undefined.
The method or statement also returns undefined if the variable that is being evaluated does not have an assigned value. See the following example.
let marvel
console.log(marvel == undefined)
So, if the marvel is undefined, it will return a true or otherwise false. This is because we have not assigned the value to the marvel yet; that is why it returns undefined.
The output is the following,
If you define a function that has a return statement or returns no value, then it returns undefined.
function js_undefined() {
}
console.log(js_null())
Output
undefined
When you call the js_undefined() function, it returns undefined because there is no return statement.
In the console, printing shows undefined, showing that we explicitly force print the output.
How to declare an undefined in Javascript
In some programming languages, you don’t have to have an initial value assigned to them. For example, the initial value for some variables might be Null, or in the Javascript case, it is undefined.
So, if you declare a variable in Javascript and do not assign the initial value, then the value of that variable is automatically undefined.
let data
console.log(data)
Output
undefined
If we don’t define a variable and direct print its value in the console, then we will get ReferenceError.
console.log(data)
Output
console.log(data)
^
ReferenceError: data is not defined
All variables in Javascript come into life through the assignment operator.
A variable can only start life as undefined if you don’t assign any value.
If you don’t define a variable and directly try to print in the console, you will get ReferenceError.
Using undefined as part of a comparison
Let’s deep dive into the == or === equality operators to check for undefined.
Checking null values using double equality(==) operator
console.log("Is undefined same as empty: ", undefined == "")
console.log("Is undefined same as zero: ", undefined == 0)
console.log("Is undefined same as false: ", undefined == false)
console.log("Is undefined same as NaN: ", undefined == NaN)
console.log("Is undefined same as 0n: ", undefined == 0n)
console.log("Is undefined same as null: ", undefined == null)
console.log("Is undefined same as undefined: ", undefined == undefined)
Output
Is undefined same as empty: false
Is undefined same as zero: false
Is undefined same as false: false
Is undefined same as NaN: false
Is undefined same as 0n: false
Is undefined same as null: true
Is undefined same as undefined: true
In the above example, we have checked the undefined value against some of the most unexpected and erroneous values, and we have got the output, and some of them are still unexpected to us.
First, undefined in Javascript is not equal to empty. Then undefined is not equal to zero, and undefined is not equal to a false boolean value. Then we checked against the NaN value, which is not equal to undefined either.
Then 0n, which is not equal. But when it comes to undefined == null, it returns true.
That means two null values are the same. In fact, the only values that null is loosely equal to are undefined(undefined == null), returns true, and itself(undefined == undefined) true. Both return true.
Checking null values using triple equality(===) operator
console.log("Is undefined strict equal to empty: ", undefined === "")
console.log("Is undefined strict equal to zero: ", undefined === 0)
console.log("Is undefined strict equal to false: ", undefined === false)
console.log("Is undefined strict equal to NaN: ", undefined === NaN)
console.log("Is undefined strict equal to 0n: ", undefined === 0n)
console.log("Is undefined strict equal to undefined: ", undefined === undefined)
console.log("Is undefined strict equal to null: ", undefined === null)
Output
Is undefined strict equal to empty: false
Is undefined strict equal to zero: false
Is undefined strict equal to false: false
Is undefined strict equal to NaN: false
Is undefined strict equal to 0n: false
Is undefined strict equal to undefined: true
Is undefined strict equal to null: false
As we have checked earlier, undefined is not strictly equal to null. It is a good idea to catch null and undefined values, as both represent an absence of a value.
That means checking for undefined is one of the few times in JavaScript that using == is recommended, while otherwise === (strict comparison operator) is generally recommended.
Checking typeof operator with undefined
let marvel
if (typeof marvel === 'undefined') {
console.log('Marvel is undefined')
}
else {
console.log('It is not undefined')
}
We have compared the undefined variable marvel with the above code’s unassigned variable. So, if the condition is true, it will print the console message.
See the output.
Difference between null and undefined in Javascript
The undefined and null are equal in value but different in type.
console.log(typeof undefined)
console.log(typeof null)
console.log(null === undefined )
console.log(null == undefined)
See the output.
See, if you compare the value, they are both the same, but if you compare its datatype, they are different; that is why we get false.
JavaScript NaN
NaN is a property of the global object. I think the definition is clear enough. JavaScript returns this value when the Number we’re supposed to get isn’t a number.
For example, when trying to subtract an “appdividend” from 21 or divide 12 by “KDL,”.
See the following example.
console.log('Appdividend' - 30)
See the output.
The NaN property is the same as the Number.Nan property.
When adding something to the string, we can use the isNaN() global function to check if a value is a NaN value. If JavaScript sees a + sign and a string, it automatically converts the second addition element into the string.
Now, let’s check the typeof NaN.
console.log(typeof NaN)
Run the file and see the output.
The data type of NaN is a Number. Not an object or undefined or null.
If NaN compared to itself returns false, no matter what we’re going to compare it to, it will always be false. See the following code.
console.log(NaN === NaN)
console.log(NaN == NaN)
See the output.
Declaring NaN in Javascript
You can assign a NaN value to any variable using an assignment operator.
let data = NaN
console.log(data)
Output
NaN
Using NaN as part of a comparison
NaN compares unequal (via ==, !=, ===, and !==) to any other value, including another NaN value. Use Number.isNaN() to determine whether a value is NaN. Or perform a self-comparison: NaN, and only NaN, will compare unequal to itself.
console.log(NaN === NaN);
console.log(Number.NaN === NaN)
console.log(isNaN(NaN))
console.log(isNaN(Number.NaN))
Output
false
false
true
true
We have compared NaN values with itself and other values using triple equality or strict comparison operator. From the output, we can see that NaN is not strictly equal to NaN. For example, even the Number object’s NaN property is not similar to NaN.
Then we have to test NaN and Number.NaN values with inbuilt Javascript isNaN() function which returns true.
Difference between isNaN() and Number.isNaN()
Number.isNaN() is almost the same or identical to ES5 global isNaN method. Number.isNaN returns whether the given value equals NaN.
The isNaN() function checks whether the given value is not a number or cannot be converted to a Number.
On the other side, the Number.isNaN() only checks if the value is equal to NaN (it uses a different algorithm than ===, though).
For example, the String ‘AppDividend’ is not a number and cannot be converted into a number, but it is not NaN.
console.log(isNaN('AppDividend'))
console.log(Number.isNaN('AppDividend'))
Output
true
false
Conclusion
JavaScript null is a primitive value that represents a deliberate non-value. Undefined is a primitive value representing a variable or object property that has not been initialized. NaN is a value representing Not-A-Number and results from an invalid mathematical operation.
The null is one of JavaScript’s primitive values. The NaN is a property of the global object. The undefined global property represents the primitive value undefined. It is one of JavaScript’s primitive types.