Given an array containing functions and the task is to access its element in different ways using JavaScript.
Approach:
- Declare an array of functions.
- The array of functions works with indexes like an array function.
Example 1: In this example, the function call is initiated from the element of the array but the function is defined somewhere else. We can pass arguments to the function while calling.
html
<body style="text-align:center;"> <h1 style="color:green;"> GeeksForGeeks </h1> <h3>Array of functions in javascript</h3> <p id="GFG_UP" style="font-size: 19px; font-weight: bold;"> </p> <button onClick="GFG_Fun()"> click here </button> <p id="GFG_DOWN" style="color: green; font-size: 24px; font-weight: bold;"> </p> <script> var up = document.getElementById('GFG_UP'); var down = document.getElementById('GFG_DOWN'); function firstFun(str) { down.innerHTML = str; } function secondFun(str) { down.innerHTML = str; } function thirdFun(str) { down.innerHTML = str; } // Declare array of functions var arrayOfFunction = [ firstFun, secondFun, thirdFun ] up.innerHTML = "Calling function from the array of functions"; // Function call function GFG_Fun() { arrayOfFunction[0]("This is first function"); } </script></body> |
Output:
Example 2: In this example, the function (anonymous) itself is defined as the elements of the array. We can access it by accessing the element of the array followed by ().
html
<body style="text-align:center;"> <h1 style="color:green;"> GeeksForGeeks </h1> <h3>Array of functions in JavaScript</h3> <p id="GFG_UP" style="font-size: 19px; font-weight: bold;"> </p> <button onClick="GFG_Fun()"> click here </button> <p id="GFG_DOWN" style="color: green; font-size: 24px; font-weight: bold;"> </p> <script> var up = document.getElementById('GFG_UP'); var down = document.getElementById('GFG_DOWN'); // Declare an array of functions var arrayOfFunction = [ function() { down.innerHTML = "Inside First function"; }, function() { down.innerHTML = "Inside Second function"; }, function() { down.innerHTML = "Inside Third function"; } ] up.innerHTML = "Calling function from the array of functions"; function GFG_Fun() { arrayOfFunction[2](); } </script></body> |
Output:
Whether you’re preparing for your first job interview or aiming to upskill in this ever-evolving tech landscape, neveropen Courses are your key to success. We provide top-quality content at affordable prices, all geared towards accelerating your growth in a time-bound manner. Join the millions we’ve already empowered, and we’re here to do the same for you. Don’t miss out – check it out now!
