Warning: session_start(): open(/tmp/sess_36467c7b6805ec6e10587fbcb29918f1, O_RDWR) failed: Disk quota exceeded (122) in /home/wvyrfnwn/learnshareit.com/wp-content/plugins/learnpress/inc/class-lp-page-controller.php on line 1007

Warning: session_start(): Failed to read session data: files (path: /tmp) in /home/wvyrfnwn/learnshareit.com/wp-content/plugins/learnpress/inc/class-lp-page-controller.php on line 1007

Warning: ftp_nlist() expects parameter 1 to be resource, null given in /home/wvyrfnwn/learnshareit.com/wp-admin/includes/class-wp-filesystem-ftpext.php on line 420

Warning: ftp_pwd() expects parameter 1 to be resource, null given in /home/wvyrfnwn/learnshareit.com/wp-admin/includes/class-wp-filesystem-ftpext.php on line 230

Warning: ftp_pwd() expects parameter 1 to be resource, null given in /home/wvyrfnwn/learnshareit.com/wp-admin/includes/class-wp-filesystem-ftpext.php on line 230

Warning: ftp_pwd() expects parameter 1 to be resource, null given in /home/wvyrfnwn/learnshareit.com/wp-admin/includes/class-wp-filesystem-ftpext.php on line 230

Warning: ftp_nlist() expects parameter 1 to be resource, null given in /home/wvyrfnwn/learnshareit.com/wp-admin/includes/class-wp-filesystem-ftpext.php on line 420

Warning: ftp_pwd() expects parameter 1 to be resource, null given in /home/wvyrfnwn/learnshareit.com/wp-admin/includes/class-wp-filesystem-ftpext.php on line 230

Warning: ftp_pwd() expects parameter 1 to be resource, null given in /home/wvyrfnwn/learnshareit.com/wp-admin/includes/class-wp-filesystem-ftpext.php on line 230

Warning: ftp_pwd() expects parameter 1 to be resource, null given in /home/wvyrfnwn/learnshareit.com/wp-admin/includes/class-wp-filesystem-ftpext.php on line 719

Warning: ftp_nlist() expects parameter 1 to be resource, null given in /home/wvyrfnwn/learnshareit.com/wp-admin/includes/class-wp-filesystem-ftpext.php on line 420

Warning: ftp_pwd() expects parameter 1 to be resource, null given in /home/wvyrfnwn/learnshareit.com/wp-admin/includes/class-wp-filesystem-ftpext.php on line 230

Warning: ftp_pwd() expects parameter 1 to be resource, null given in /home/wvyrfnwn/learnshareit.com/wp-admin/includes/class-wp-filesystem-ftpext.php on line 230

Warning: ftp_pwd() expects parameter 1 to be resource, null given in /home/wvyrfnwn/learnshareit.com/wp-admin/includes/class-wp-filesystem-ftpext.php on line 230

Warning: ftp_nlist() expects parameter 1 to be resource, null given in /home/wvyrfnwn/learnshareit.com/wp-admin/includes/class-wp-filesystem-ftpext.php on line 420

Warning: ftp_pwd() expects parameter 1 to be resource, null given in /home/wvyrfnwn/learnshareit.com/wp-admin/includes/class-wp-filesystem-ftpext.php on line 230

Warning: ftp_pwd() expects parameter 1 to be resource, null given in /home/wvyrfnwn/learnshareit.com/wp-admin/includes/class-wp-filesystem-ftpext.php on line 230

Warning: ftp_pwd() expects parameter 1 to be resource, null given in /home/wvyrfnwn/learnshareit.com/wp-admin/includes/class-wp-filesystem-ftpext.php on line 719

Warning: ftp_mkdir() expects parameter 1 to be resource, null given in /home/wvyrfnwn/learnshareit.com/wp-admin/includes/class-wp-filesystem-ftpext.php on line 562

Warning: ftp_nlist() expects parameter 1 to be resource, null given in /home/wvyrfnwn/learnshareit.com/wp-admin/includes/class-wp-filesystem-ftpext.php on line 420

Warning: ftp_pwd() expects parameter 1 to be resource, null given in /home/wvyrfnwn/learnshareit.com/wp-admin/includes/class-wp-filesystem-ftpext.php on line 230

Warning: ftp_pwd() expects parameter 1 to be resource, null given in /home/wvyrfnwn/learnshareit.com/wp-admin/includes/class-wp-filesystem-ftpext.php on line 230
How To Solve The Error “Cannot invoke an object which is possibly 'undefined'” In TypeScript - LearnShareIT

How To Solve The Error “Cannot invoke an object which is possibly ‘undefined’” In TypeScript

Cannot invoke an object which is possibly ‘undefined’ in TS

In this tutorial, I will show you how to solve the “Cannot invoke an object which is possibly ‘undefined’” error in TS. The error occurs when you use strict mode for null check in TypeScript.

Reproduce the error

The “Cannot invoke an object which is possibly ‘undefined’” error can happen if you use strict mode for null check in TypeScript. This strict mode is specified by the “strictNullChecks” property of the “compilerOptions” config in your tsconfig.json file.

{
    "compilerOptions": {
        "target": "ES6",
        "lib": [
        	"ES2015", 
          	"DOM"
        ],
        "strictNullChecks": true
    }
}

This strict mode can help you ensure that your code does not have any use of null variables or functions. TypeScript compiler will throw an error if you try to invoke a function that is possibly undefined.

Example code:

type Person = {
	// Optional mark
	sayHello?: (str: string) => string; 
}

let john: Person = {
    sayHello: function(str: string) {
      	return `Hello ${str}!`;
    },
};

console.log(john.sayHello("Hanna"));

Output:

main.ts:11:13 - error TS2722: Cannot invoke an object which is possibly 'undefined'.

Solutions to fix “Cannot invoke an object which is possibly ‘undefined’” error

Solution 1: Remove the use of the optional mark

The ‘?’ optional mark help you tell the TypeScript compiler that your variable or function might be ‘undefined’, but this may cause an error when the strict mode for the null check is on. If you can make sure that your variable or function is always defined before using it and you do not have a specific reason to use the optional mark, you should remove it.

Example code:

type Person = {
  	// Removed optional mark
  	sayHello: (str: string) => string; 
}

let john: Person = {
    sayHello: function (str: string) {
      	return `Hello ${str}!`;
    }
};

console.log(john.sayHello("Hanna"));

Output:

Hello Hanna!

Solution 2: Check if the function is not ‘undefined’ before using

You can check if the function is not ‘undefined’ before using it so that the TypeScript compiler knows that the function only is invoked when it is not ‘undefined’. In this way, compiler won’t throw an error about this.

Example code:

type Person = {
  	// Optional mark
  	sayHello?: (str: string) => string; 
}

let john: Person = {};

if (john.sayHello) {
  	console.log(john.sayHello("Hanna"));
} else {
  	console.log("john.sayHello() function is undefined!");
}

Output:

john.sayHello() function is undefined!

Solution 3: Use the exclamation mark

The exclamation mark tells the TypeScript compiler that you strongly understand your code and can make sure that the function or variable will be defined when running. So the TypeScript compiler can skip the error.

Example code:

type Person = {
  	// Optional mark
  	sayHello?: (str: string) => string; 
}

let john: Person = {};
john.sayHello = function (str: string) {
  	return `Hello ${str}!`;
};

console.log(john.sayHello!("Michael"));

Output:

Hello Michael!

Summary

In this tutorial, I’ve shown you how to solve the “Cannot invoke an object which is possibly ‘undefined’” error in TS. You should remove the use of the optional mark if you do not really need it. You can also check if the function is defined before using or use the exclamation mark to tell the TypeScript compiler to skip the error.

Maybe you are interested:

Leave a Reply

Your email address will not be published. Required fields are marked *