How to check null or undefined of an object in Typescript Example

How to check null or undefined of an object in Typescript Example

In this blog post, I will take you to the following examples.

  • Undefined or null check with the conditional expression
  • Typeguard null and undefined union check
  • Using Optional Chaining and nullish coalescing operators
  • lodash/ramda isNil method

You can check another post on Fix for Object is possibly null

Checking for null or undefined of an object in JavaScript

The condition used to check null or undefined values in JavaScript is crucial. TypeScript, as a superset of JavaScript with added features like typing and assertions, allows every piece of code to function within its scope.

if (expression) {
  console.log('Not null');
}

The expression must evaluate to true or false.

It evaluates to false for the following values.

  • Null
  • Empty string spaces - ""
  • Undefined
  • NAN - Not a number zero
  • False

Let’s consider an example.

if (obj !== undefined && obj !== null) {
  console.log("Object is Not Null");
}

This works in both JavaScript and TypeScript. Now, let’s delve into an example of achieving the same using type guards in TypeScript.

Typeguard null and undefined union check Typescript 2. x

The isNullOrUndefined function defines accepting object type. Null types are added as a Union type with type guard syntaxes and return boolean values.

function isNullOrUndefined<T>(object: T | undefined | null): object is T {
  return <T>object !== undefined && <T>object !== null;
}

let obj = null;
console.log(isNullOrUndefined(obj)); // false
let obj1 = 123;
console.log(isNullOrUndefined(obj1)); // true

Using Optional Chaining and Nullish Coalescing Operators

Optional Chaining and Nullish Coalescing Operator were introduced in ES11. TypeScript implements the same in the 3.7 version. Both are used to check for null and undefined values. These both are checked for null and undefined values.

Optional Chaining operator: The symbol ? is used to check if the account is null or undefined. It will return an id if an account is not null or undefined, else return undefined.

let account = { id: 1 }
let departmentId = account?.id?
console.log(departmentId)

Now, let’s see an example of using nullish coalescing operators.

let account = null;
let departmentId = account??.id
console.log(departmentId)

If an account is not null or undefined, it returns the id; otherwise, it returns the account.

jQuery Null or Undefined

To check in JavaScript or jQuery, use the typeof operator. typeof checks objects and returns undefined if the object is undefined or null.

if (typeof obj == "undefined") {
  console.log("Object is null");
}

lodash/ramda isNil Method

lodash and rambda provide the isNil method to check for defined or not.

_.isNil(value);

It returns true/false - true for Nullish values, else false. It accepts an object to check for nullish values.

Accepts object to check for nullish values.

Let’s see an example.

let obj;
console.log(_.isNil(null)); // true
console.log(_.isNil(false)); // false
console.log(_.isNil(obj)); // true

Conclusion

To summarize, we’ve learned about checking if an object is null or undefined in TypeScript through various methods.