. Advertisement .
..3..
. Advertisement .
..4..
The function “is not defined” error in JavaScript can be confusing for many beginners. Check this tutorial to understand how it occurs and how you can fix it.
How To Fix The Function “is not defined” Errory In JavaScript
If you use this JavaScript snippet, it will return an error.
example_number = 127;
factorial_number = factorial(example_number);
console.log(factorial_number)
Output:
ReferenceError: factorial is not defined
From the error message, you can easily guess the reason behind it. This reference issue happens because you haven’t defined the factorial() function before calling it. This is a requirement of the JavaScript programming language.
The most obvious solution is to go back and add the missing definition.
Example:
function example_factorial(x) {
if (x === 0) {
return 1;
}
return x * example_factorial(x - 2);
}
x = 12;
f_sample = example_factorial(x);
console.log(f_sample)
Output:
46080
The JavaScript code should now run fine because you have created a function via its declaration before running it. If you are unfamiliar with function declaration, here is the basic syntax:
function name(parameter1, parameter2, ... parameterN) {
// function body
}
Many beginners a function expression for its declaration. They may seem familiar at first but these concepts are totally different in JavaScript. For starters, you must use the function first in a declaration, while function expressions in JavaScript don’t start with this keyword.
However, you can use an expression in place of a function declaration to fix the function “is not defined” error in JavaScript. You can rewrite the snippet above with a function expression.
let example_factorial = function(x) {
if (x === 0) {
return 1;
}
return x * example_factorial(x - 2);
}
x = 12;
f_sample = example_factorial(x);
console.log(f_sample)
Output:
46080
The expression above does two things. It declares a function and assigns it to the factorial variable. As a result, JavaScript can know which function you are calling.
Failure to load a JavaScript file properly within an HTML page is another common reason you run into the function “is not defined” error in JavaScript. Here is an example.
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<title>Fix The Function “is not defined” Error In JavaScript</title>
</head>
<body>
<script src="src/script.js"></script>
<script type="text/javascript">
x = 12;
f_sample = factorial(x);
console.log(f_sample)
</script>
</body>
</html>
The console of your browser will show this message:
ReferenceError: factorial is not defined
There are several ways to fix this. You can, for instance, insert the correct JavaScript code right into the HTML body.
<body>
<script type="text/javascript">
function example_factorial(x) {
if (x === 0) {
return 1;
}
return x * example_factorial(x - 2);
}
x = 12;
f_sample = example_factorial(x);
console.log(f_sample)
</script>
</body>
Output:
46080
Another way to declare and call the factorial() function properly:
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script type="text/javascript" src="src/script.js"></script>
</head>
<body>
<script type="text/javascript">
f = factorial(5);
console.log(f);
</script>
</body>
</html>
src/script.js
function factorial(n) {
if (n === 0) {
return 1;
}
return n * factorial(n - 1);
}
Output:
120
Conclusion
The function “is not defined” error in JavaScript happens when the function hasn’t been declared. You can add the declaration (or expression) before it is called to fix the problem.
Leave a comment