DONATE  
MENU
AJAX
JSON
JAVASCRIPT
HTML

JavaScript Tutorials

INTRODUCTION

» Introduction to JavaScript

» Practice IT Editor

» JavaScript Example

» JavaScript Placement

» JavaScript Syntax

» JavaScript Statements

» JavaScript Input

» JavaScript Output

» JavaScript Comments

» JavaScript Variables

» Variables' Scope

» JavaScript Operators

» JS Expressions & Concatenation

» JavaScript Data Type

» JavaScript Numbers

» Number Object

» JavaScript Strings

» String Object

» JavaScript Booleans

» Boolean Object

» JavaScript Functions

» JavaScript Arrays

» Array Object - Properties

» Array Object - Methods

» JavaScript Objects

» JavaScript Undefined

» JavaScript Nulls

CONDITIONAL TESTING

» If Statement

» If Else Statement

» JavaScript Ternary Operator

» Switch Statement

LOOPS

» For Loops

» While Loops

» Break & Continue

» For...In Loops

» do...while Loop

FUNCTIONS

» JavaScript Functions

» Creating Functions

» Functions' Parameters

» Functions' Arguments

» Function Invocation

» The Return Keyword

» The Arguments Object

» Callback Functions

» Arrow Functions

ARRAYS

» JavaScript Arrays

» Creating Arrays

» Accessing Arrays

» Looping Arrays

» Multi - dimensional Arrays

OBJECTS

» JavaScript Objects

» Creating Objects

» Prototype Definition

» Accessing Objects

» The this Keyword

AJAX

» Introduction to AJAX

JSON

» Introduction to JSON

JAVASCRIPT DATES

» The Date Object

» Date Methods

» Timing (SetInterval & SetTimeout)

MATH OBJECT

» Math Object

» Math Methods

HTML / JS DOM

» DOM Introduction

» Accessing HTML Elements in DOM

» Get And Change Elements' Contents & Values

» Change Styling - DOM CSS

» DOM Attributes

» JavaScript Event Listeners

» DOM Event Listeners

» JS Events

MISCELLANEOUS

» JS Strict Mode

» JavaScript Hoisting

» JavaScript let keyword

» Reserved Keywords

» JS Best Practices

» JavaScript vs ECMAScript

JAVASCRIPT EXAMPLES

» JavaScript Calculator

.. » JavaScript » Functions » Function Invocation
Share Tweet WhatsApp

Function Invocation

Function invocation is same thing as calling a function. It is the act of calling or invoking or instructing a function to do what it was created for. Without invoking a function, that function is as good as useless in your program as functions don't execute until they are called. This is simply why JavaScript as a language has a lot of pre defined functions but their effects are not visible until you call them. INVOKING FUNCTIONS To invoke functions in JavaScript, you simply write the name of the function followed by parentheses (()).
addNum(); //will call a function named addNum
myFunc(); //will call a function named myFunc
<script>
//DEFINING THE FUNCTION
var greet = function (){
alert("Hello");
};

//CALLING THE FUNCTION
greet();
</script>

Copy PRACTICE IT

Above, we invoked the greet function. INVOKING FUNCTIONS ON VARIABLES Functions can also be invoked or called on variables. When this happens, the function do not only execute but stores whatever is returned from it execution on the variable. Therefore, this method should be used when a function is returning a value.
var myVar = myFunc();
var num = getNum();
This explains why we do call the JavaScript predefined functions, prompt() and confirm() on variables. The prompt() will return what the user enters and stores it on the variable for our use while the confirm() will return the user's choice (true if OK and false if CANCEL) and stores on the variable.
<script>
var feedback = confirm("Do you want to visit this webpage?");

alert(feedback);

var num = prompt("Enter a number:");

alert(num);
</script>

Copy PRACTICE IT

From the above, you can deduce that without calling the functions on variables, we won't be able to obtain what was returned.
NOTE:
  • You will learn how to return values from functions in subsequent pages
INVOKING FUNCTIONS FROM HTML ELEMENTS Functions can also be called from HTML elements through event listeners. Events are various actions taking place on a webpage. For example, when a user clicks on a button or is typing into an input field. Have you ever created accounts on some websites in which as you were keying in a password, the website was telling you the strength(WEAK, GOOD, STRONG) of the password you are composing? Now, that is because an event (as you are typing) is calling a function to continuously check what you are typing in and to see if it meets up with the various strengths defined by such websites. You will learn more about events but then, here is a button calling a function in JavaScript with an event.
<button onclick='msg()'>SUBMIT</button>

<script>
function msg(){
alert("SUBMITTED.");
}
</script>

Copy PRACTICE IT

Above, we have a button calling a function when clicked on. Here, the "onclick" is the event whose value is a function (msg()) to trigger when the event(click) happens on the webpage. Recursive Functions A recursive function is a function that invokes itself. Here, the function calls itself from its own definition. For example, if a function named myFunc invokes itself(myFunc), that is recursion and the function is called a recursive function. Example
<script>
//FUNCTION DEFINITION
function myFunc(val){
document.write("The value is "+val+"<br/>"); //Outputs value
if (val < 10){//if the value of parameter is less than 10
myFunc(val + 2); //The function invokes itself (RECURSION)
}
}

myFunc(1);
</script>

Copy PRACTICE IT

Explained Above is an instance of recursion taking place. The function, myFunc expects a parameter to display and the parameter should be a number. Now, if the number is less than 10, it adds 2 to the parameter and invokes itself (myFunc) to display the new value. SUMMARY
  1. Function invocation is simply instructing a function to do what it was created for.
  2. Without invoking a function, it cannot do what it was created for and is therefore useless. This explains why JavaScript have a lot of pre defined functions but they are useless to your program until you invoke them.
  3. To invoke a function, you write the function name and have parentheses in front of it.
  4. You can also call a function on a variable. This should be done when such functions are expected to return a value which will then be stored on the variable.
  5. HTML elements' events can also call functions when they happen.
  6. A recursive function is a function that invokes itself.
Take a short quiz on Function Invocation.
Ask a question or tell us if Function Invocation is easy or not.
cent?

Join our 1,090 subscribers to receive tutorials' updates!

  We won't spam your mail box. We hate it.





StackBeginner 2021 © Joseph Omamode