How to execute an array of functions in JavaScript?

To execute an array of functions, we can use a for loop or the forEach() array method in JavaScript.

TL;DR

// Functions to execute
function greetPeople() {
  console.log("Hello People!");
}

function sayFirstname() {
  console.log("My First name is Roy");
}

function sayLastname() {
  console.log("My First name is Daniel");
}

// save the functions
// references in an array
const funcsArr = [greetPeople, sayFirstname, sayLastname];

// Loop through each array elements (functions references)
// and invoke the functions
for (let i = 0; i < funcsArr.length; i++) {
  // get the current function getting looped
  const func = funcsArr[i];

  // call the function
  func();
}

For example let's say we have some functions like greetPeople(), sayFirstname() and sayLastname() like this,

// Functions to execute
function greetPeople() {
  console.log("Hello People!");
}

function sayFirstname() {
  console.log("My First name is Roy");
}

function sayLastname() {
  console.log("My First name is Daniel");
}

Now to execute this funtions in a loop, first let's save all the function references to an array like this,

// Functions to execute
function greetPeople() {
  console.log("Hello People!");
}

function sayFirstname() {
  console.log("My First name is Roy");
}

function sayLastname() {
  console.log("My First name is Daniel");
}

// save the functions
// references in an array
const funcArr = [greetPeople, sayFirstname, sayLastname];

NOTE: We are only saving the references to the functions in the array and not calling the functions inside the array.

Now to call these functions, let's use a for loop and loop through each element in the array (in our case it is the functions references) and call the functions inside the loop. It can be done like this,

// Functions to execute
function greetPeople() {
  console.log("Hello People!");
}

function sayFirstname() {
  console.log("My First name is Roy");
}

function sayLastname() {
  console.log("My First name is Daniel");
}

// save the functions
// references in an array
const funcsArr = [greetPeople, sayFirstname, sayLastname];

// Loop through each array elements (functions references)
// and invoke the functions
for (let i = 0; i < funcsArr.length; i++) {
  // get the current function getting looped
  const func = funcsArr[i];

  // call the function
  func();
}

Now if we look into the console we will see this output from the three functions in the array.

Hello People!
My First name is Roy
My First name is Daniel

See the above code live in JSBin

We can also acheive the same using the forEach() array method like this,

// Functions to execute
function greetPeople() {
  console.log("Hello People!");
}

function sayFirstname() {
  console.log("My First name is Roy");
}

function sayLastname() {
  console.log("My First name is Daniel");
}

// save the functions
// references in an array
const funcsArr = [greetPeople, sayFirstname, sayLastname];

// Loop through each array elements (funtions references)
// and invoke the funtions
funcsArr.forEach((func) => {
  // call the current
  // funtion getting looped
  func();
});