Null in TypeScript

The null in TypeScript is a special value & also a data type. The value null represents the intentional absence of any object value. It is one of TypeScript’s primitive values and is treated as falsy for boolean operations. The value of null is represented in using the literal null.

What is Null Value in TypeScript

The value null represents the intentional absence of any object value. It represents nothing or no value. null means we know that the variable does not have any value. TypeScript does not set the value of a variable to null. We need to do set it explicitly. To do that we assign the literal null to the variable

let a            //a is of type any
a=null

TypeScript also has an undefined value and it means the value is not assigned or we do not know its value.

Take an example of the following person function which returns the person object. It has two fields. name & dateOfMarriage. The name is a required field, but the dateOfMarriage is optional because not everyone is married.

function person(name:string,dateOfMarriage:Date|null) {
    return { 
        name: name, 
        dateOfMarriage: dateOfMarriage
    }
}

Now, what value do you store in dateOfMarriage if the person is not married?. We explicitly set its value to null to indicate there is no value, which implies that the person is not married.

//Null is set explicitly. Person is not married

console.log(person("Colin Bower", null))    

//Output
//{name: 'Colin Bower', dateOfMarriage: null}

Null Data Type

Null is also a Data Type in TypeScript.

We can create a null variable by annotating the variable with null. Declaring a variable as of type null does not give it a value of null, but it gets the default value of undefined. We must assign the value null to it.

let nullVar: null;
console.log(nullVar)       //undefined
 
nullVar  =null;
console.log(nullVar )       //null

The only values that you can assign to a null variable are null. You can also assign undefined if you are using <= TypeScript 1.8 or you have disabled strictNullCheck.

let nullVar: null;
 
//Allowed
nullVar=null;
nullVar=undefined;    //only if strictNullCheck is disabled

//Not Allowed
nullVar=10;          //type '10' is not assignable to type 'null'
nullVar={}           //Type '{}' is not assignable to type 'null'

Non Nullable Types

TypeScript 2.0 Introduced the strictNullChecks. Prior to that, you can assign null to variables of other Data Types.

Since TypeScript 2.0 you can assign null only to a variable of type null or any

let anyVar:any
let nullVar:null

anyVar=null   //ok
nullVar=null  //ok


let undefVar:undefined
let numVar:number

//NOT ok

undefVar=null     //Type 'null' is not assignable to type 'undefined'.
numVar=null       //Type 'null' is not assignable to type 'number'.

To Make variables of other data types nullable, we need to explicitly specify it. We can make use of the union type, which allows us to construct a type that is a union of two or more types. In the following example, the numVar is a union type containing the number, null & undefined types.

let numVar: number | null | undefined;

numVar= 24;               //ok
numVar= undefined;        //ok
numVar= null;             //ok

You can revert to the old behavior if you disable strictNullChecks

Typeof null is object

Although the data type of null value is null, the TypeOf operator incorrectly returns “object”. This is a very old bug in JavaScript. The bug is not fixed as it will break many existing codes.

let a = null
console.log(typeof(a))      //object

Checking for Null

You cannot use typeof operator to check for null as it returns “object”. Hence you can either use the == or ===

let nVar:number| null | undefined;;
nVar=null;
console.log(nVar)                     //null
 
console.log(typeof nVar)              //object
 
console.log(nVar==null)               //true
console.log(nVar===null)              //true

The undefined is also treated as having no value. Hence running a loose equality checker between them will return true

console.log(null==undefined)        //true

let a                    //a has the default value of undefined 
console.log(a==null)     //true because both null & undefined is treated as no value

That is the reason why you should use the strict equality checker which also checks the data type.

let a
console.log(a===null)    //false because Because types are different

null is falsy

The null along with false, 0, '', undefined, NaN is considered as falsy values in JavaScript. Whenever JavaScript encounters a null in an expression it implicitly coerces it to false

let a =null
 
if (a) {
    console.log("true")     //this code does not execute
}
 
if (!a) {
    console.log("false")    //false
}

But that does not mean that null is false. It is neither false nor true. null does not have any value

let a =null
 
//loose equality check
 
console.log(a==false)       //false
console.log(a==true)        //false
 
 
//Strict equality check
 
console.log(a===false)      //false
console.log(a===true)       //false