How to Check if a Function is Defined in JavaScript

avatar

Borislav Hadzhiev

Sat Oct 30 20212 min read

banner

Photo by Brooke Cagle

Check if a Function is Defined in JavaScript #

Use the typeof operator to check if a function is defined, e.g. typeof myFunction === 'function'. The typeof operator returns a string that indicates the type of a value. If the function is not defined, the typeof operator returns "undefined" and doesn't throw an error.

index.js
if (typeof myFunction === 'function') { console.log('โœ… function is defined'); } else { // ๐Ÿ‘‡๏ธ this runs console.log('โ›”๏ธ function is NOT defined'); }

We used the typeof operator to check if a function is defined.

The operator returns a string that indicates the type of a value. Here are some examples:

index.js
console.log(typeof (() => {})); // ๐Ÿ‘‰๏ธ "function" console.log(typeof function () {}); // ๐Ÿ‘‰๏ธ "function" console.log(typeof null); // ๐Ÿ‘‰๏ธ "object" console.log(typeof []); // ๐Ÿ‘‰๏ธ "object" console.log(typeof {}); // ๐Ÿ‘‰๏ธ "object" console.log(typeof ''); // ๐Ÿ‘‰๏ธ "string" console.log(typeof 0); // ๐Ÿ‘‰๏ธ "number"

The typeof operator doesn't throw an error when used with a variable that is not declared, instead it returns the string "undefined".

index
console.log(typeof doesNotExist); // ๐Ÿ‘‰๏ธ "undefined"

However, if you use the typeof operator before declaring a variable with the let or const keywords, you would get an error.

index.js
// โŒ Error: Cannot access 'myFunction' before initialization if (typeof myFunction === 'function') { console.log('โœ… function is defined'); } else { console.log('โ›”๏ธ function is NOT defined'); } const myFunction = () => {};

We used the typeof operator before initializing a function using the const keyword.

This returns an error because, we are trying to access a variable that exists in the program, but is not yet declared.

We would get the same result if we declared the function using the let keyword.

However, if we use the var keyword, we wouldn't get an error, because of how hoisting works in JavaScript.

index.js
if (typeof myFunction === 'function') { console.log('โœ… function is defined'); } else { // ๐Ÿ‘‡๏ธ This runs console.log('โ›”๏ธ function is NOT defined'); } var myFunction = () => {};

We declared the function using the var keyword, so we didn't get an error when using the typeof operator, however the else block ran.

This is what happens under the hood when using the var keyword.

index.js
var myFunction; if (typeof myFunction === 'function') { console.log('โœ… function is defined'); } else { // ๐Ÿ‘‡๏ธ This runs console.log('โ›”๏ธ function is NOT defined'); } myFunction = () => {};

The declaration of the variable gets hoisted to the top, however the assignment of the value remains where it is.

This is why we don't get an error, but also the variable doesn't have a type of function yet.

It is very rare that you would write or read code like this, however it's good to have an understanding of these fundamental concepts.

Further Reading #

Join my newsletter

I'll send you 1 email a week with links to all of the articles I've written that week

Buy Me A Coffee