Explain invoking function in JavaScript
In this article, we will learn about invoking the function in Javascript, along with understanding its implementation through examples. Function Invoking is a process to execute the code inside the function when some argument is passed to invoke it. You can invoke a function multiple times by declaring the function only once. When the function is defined, the code inside a function will not be executed. It is common to use the term “call a function” instead of “invoke a function”. Although, there has a difference between these two terms. When you make a function call, you are directly telling the function to execute, whereas when you invoke a function, you are letting something execute the function. For instance,
functionName();
Here, we have invoked the function ie., letting it run, by calling the function directly.
Syntax:
function myFunction( var ) {
return var;
}
myFunction( value );
Here, by calling myFunction, you are invoking value, which is being called indirectly.
Invoking a Function as a Method: We can define the function as an object method.
Syntax:
var myObject = {
var : value,
functionName: function () {
return this.var;
}
}
myObject.functionName();
Parameters: It contains two parameters as mentioned above and described below:
- functionName: The functionName method is a function and this function belongs to the object and myObject is the owner of the function.
- this: The parameter this is the object that owns the JavaScript code and in this case the value of this is myObject.
We will understand the above concepts through examples.
Example 1: This example uses the function invocation to add two numbers.
HTML
<h2 style="color:green">w3wiki</h2> <p> Function returns the addition of 10 and 15 </p> <p id="Beginner"></p> <script> function add(n1, n2) { return(n1 + n2); } document.getElementById("Beginner").innerHTML = window.add(10, 15); </script> |
Output:
Example 2: This example illustrates this keyword to point to the current object.
Javascript
const obj={ first_name:"Steve", last_name:"smith", name:function(){ console.log(`Full name : ${this.first_name} ${this.last_name}`); } }; obj.name(); |
Output:
Full name : Steve smith