Article Categories
- All Categories
-
Data Structure
-
Networking
-
RDBMS
-
Operating System
-
Java
-
MS Excel
-
iOS
-
HTML
-
CSS
-
Android
-
Python
-
C Programming
-
C++
-
C#
-
MongoDB
-
MySQL
-
Javascript
-
PHP
-
Economics & Finance
How to check if a JavaScript function is defined?
In this tutorial, we will learn to check whether a JavaScript function is defined before calling it. If you call an undefined function, JavaScript throws a ReferenceError with the message "function is not defined."
To avoid this error, you can check whether the function exists before calling it. We'll explore three different approaches to accomplish this.
Using the typeof Operator
The typeof operator returns the data type of a variable or function. When used with a function name, it returns 'function' if the function is defined, or 'undefined' if it's not.
Syntax
let isFunction = typeof function_name === 'function'
Parameters
function_name ? The function name without parentheses that you want to check.
Example
This example creates a function named test() and uses the typeof operator to check if it's defined before calling it.
<html>
<head>
</head>
<body>
<h2>Check if function is defined in Javascript.</h2>
<h4>Check if function is defined using <i> typeof operator.</i></h4>
<div id="output"></div>
<script>
var output = document.getElementById("output");
function test() {
output.innerHTML = "function test() is defined.";
}
if (typeof test === 'function') {
test();
} else {
output.innerHTML = "function is not defined.";
}
</script>
</body>
</html>
function test() is defined.
Using the instanceof Operator
The instanceof operator checks if an object is an instance of a specific constructor. Since functions are objects in JavaScript, you can use instanceof Function to verify if a variable is a function.
Syntax
let isFunction = function_name instanceof Function;
Example
This example demonstrates using the instanceof operator to check if the demo() function is defined.
<html>
<head>
</head>
<body>
<h2>Check if function is defined in JavaScript.</h2>
<h4>Check if function is defined using <i> instanceof operator.</i></h4>
<div id="output"></div>
<script>
var output = document.getElementById("output");
function demo() {
output.innerHTML = "Inside the function call.";
}
if (demo instanceof Function) {
demo();
} else {
output.innerHTML = "function is not defined.";
}
</script>
</body>
</html>
Inside the function call.
Using the try-catch Block
The try-catch block handles errors during code execution. When you call an undefined function, JavaScript throws a ReferenceError. You can catch this error and handle it gracefully.
Syntax
try {
// call the function here
} catch (e) {
// if the function is not defined, control comes here.
}
Example
This example calls an undefined function test() inside a try block. Since the function doesn't exist, the catch block executes.
<html>
<head>
</head>
<body>
<h2>Check if function is defined in Javascript.</h2>
<h4>Check if function is defined using <i> try-catch </i> block.</h4>
<div id="output"></div>
<script>
var output = document.getElementById("output");
function func() {
output.innerHTML = "Inside the function call.";
}
try {
test();
} catch (e) {
output.innerHTML = "Inside the catch block. <br/>";
output.innerHTML += "function is not defined.";
}
</script>
</body>
</html>
Inside the catch block. function is not defined.
Comparison
| Method | Performance | Best Use Case |
|---|---|---|
typeof |
Fast | Checking before calling |
instanceof |
Fast | Object-oriented checks |
try-catch |
Slower | Error handling scenarios |
Conclusion
The typeof operator is the most commonly used approach for checking function existence. Use try-catch when you need comprehensive error handling beyond just function checks.
15K+ Views
