Introduction to Javascript Anonymous Function
Name Anonymous indicates without a name or unknown name. So, an anonymous function defined as a function without a name whenever a function wants to return other functions than simply used this anonymous function concept.
Syntax:
function print(a){
return function (b)
{
return a*b;
}; //anonymous function
}Anonymous functions 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:
- In an example, a 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 assigned to a variable. Now, this variable becomes works as a function name.
- You can see in both cases 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 function, 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 and expecting two values from anonymous function calling.
- After passing 2 values from division(20,10) to function call, then 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:
- A normal function declared with a name multiplication by defining one 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)), we will not get actual multiplication. Why because multiplication() returns the inner anonymous function directly. So we will get out as below.
- First, we need to call the multiplication function by assigning a result into the variable. Like var out=multiplication(19).
- Then call result out () Now, we will get out 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 have anonymous function as argument and return a value from getMyClass() method calling.
- After invoking the getMyclass() method, the processor goes to this method definition and looks for the anonymous method.
- Yes, we have an anonymous method, myClass(), and it calls back to the anonymous return output. Anonymous method detected so, processors executes 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 Javascript Anonymous Function along with examples and code implementation. You can also go through our other related articles to learn more –
