Updated June 20, 2023
Introduction to Javascript Anonymous Function
Name Anonymous indicates without a name or unknown name. When a function intends to return other functions instead of using named functions, it can be defined as an anonymous function, which is a function without a name.
Syntax:
function print(a){
return function (b)
{
return a*b;
}; //anonymous function
}Anonymous functions are also used for arguments to other functions.
functionName(function () {
document.write("Hi Amar");
}, arguments);How does Anonymous Function Work in JavaScript?
Anonymous functions work without a name. Surprised right? We will see with an example.
1. General Function
Code:
function getMyName(){
document.write("I am Paramesh");
}
document.write(getMyName());Output:
2. Anonymous Function
Code:
name=function (){
document.write("I am Paramesh");
}
document.write(name());Output:
Explanation:
- For example, defining a function name with getMyName() and within the function required code written. This is a general way of defining a function.
- In other examples, the b function is defined without a name, and that unnamed function is assigned to a variable. Now, this variable becomes works as a function name.
- You can see in both cases; the output is the same as I am Paramesh.
Javascript Anonymous Function Examples with Code
Here are some of the examples of an anonymous function, which are as follows:
1. Anonymous Function without Parameter
Syntax:
var variableName=function ()
{
//code
};
variableName();Code: AnonymousWithoutParam.js
<!DOCTYPE html>
<html>
<body>
<font color="green">
<h1 align="center">Anonymous function without parameter</h1>
</font>
<script>
var names=function()
{
document.write("I am Paramesh <br>");
document.write("I am Amar <br>");
document.write("I am Sri");
};
names();
</script>
</body>
</html>Output:
Explanation:
- The anonymous function is declared with the variable name. Now, names will become functions, and it is called from anywhere.
- After calling the anonymous function, we will get our output without any error from JavaScript Engine.
2. Anonymous Function with Parameters
Syntax:
var division=function (a,b)
{
//code
};
division(20,10);Code: AnonymousWithParam.js
<!DOCTYPE html>
<html>
<body>
<font color="green">
<h1 align="center">Anonymous function with parameters</h1>
</font>
<script>
var division=function(a,b)
{
divisionOutput=a/b;
document.write("Division of "+b+" and "+a+" is :"+divisionOutput);
};
division(20,10);
</script>
</body>
</html>Output:
Explanation:
- The anonymous function is declared with a variable name division, expecting two values from the anonymous function calling.
- After passing 2 values from division(20,10) to the function call, we will get 2 as output.
3. Anonymous Function with Return Statement
Syntax:
function functionName(parameters1,parameters2,…)
{
return function(a,b,…..)
{
return //required logic;
};
}
var out= functionName(1,2,…);
document.write(out(1,2,….));Code: Multiplication.js
<!DOCTYPE html>
<html>
<body>
<font color="green">
<h1 align="center">Anonymous function with Return Statement</h1>
</font>
<script>
var multiplication=function(x)
{
return function(y)
{
return x*y;
};
}
var out=multiplication(19);
document.write("Muliplication of 2 number is :"+out(18));
</script>
</body>
</html>Output:
Explanation:
- You can declare a regular function named “multiplication” by defining a variable within it.
- Inside the general function, an anonymous function is declared by one variable, and the result return to the multiplication().
- We try to execute write(multiplication(20)), but we will not get actual multiplication. Why? Because multiplication() returns the anonymous inner function directly. So we will get out as below.
- First, we need to call the multiplication function by assigning a result to the variable. Like var out=multiplication(19).
- Then call the result out (). Now, we will get out the actual output.
4. Passing Anonymous Function as Argument
Syntax:
function functionName(parameter)
{
return parameter();
}
document.write(functionName ()
{
return
//code;
}));Code: PassFunctionAsArgument.js
<!DOCTYPE html>
<html>
<body>
<font color="green">
<h1 align="center">Passing Anonymous Function as Argument</h1>
</font>
<script>
function getMyClass(myClass)
{
return myClass(); //calling anonymous function
}
document.write(getMyClass(function (){
return "I am from Class 10th";
}));
</script>
</script>
</body>
</html>Output:
Explanation:
- write() method has an anonymous function as an argument and returns a value from the getMyClass() method calling.
- After invoking the getMyclass() method, the processor goes to this method definition and looks for the anonymous method.
- Our anonymous method, myClass(), calls back to the anonymous return output. The anonymous process is detected, so processors execute an anonymous return statement from write(getMyClass()) calling.
- It will print the output.
Recommended Articles
This is a guide to Javascript Anonymous Function. Here we discuss the syntax and working of the Javascript Anonymous Function, examples, and code implementation. You can also go through our other related articles to learn more –
