const test = [3, 5, 6, 7, 8, 0, "", null, undefined, "testing"];


 test.forEach(listItem);

function listItem(item, number, total) {
    return `<li class="${number}">${item} ${number} of ${total}</li>`;
}


let htmlDOM = `<ul>${test.map((item, index, array) => listItem(item, `${index + 1}`, `${array.length}`)).join("")}</ul>`;
  

//console.log(htmlDOM);

/**

'<ul><li class="1">3 1 of 10</li><li class="2">5 2 of 10</li><li class="3">6 3 of 10</li><li class="4">7 4 of 10</li><li class="5">8 5 of 10</li><li class="6">0 6 of 10</li><li class="7"> 7 of 10</li><li class="8">null 8 of 10</li><li class="9">undefined 9 of 10</li><li class="10">testing 10 of 10</li></ul>'

*/

(function () {
  "use strict";

  const person = {
    name: "John Doe",
    age: 30,
    hobbies: ["reading", "traveling", "coding"],
  };

  const { hobbies, name, age } = person; // descructure

  hobbies.forEach((item, idx) => passInfo(item, idx, { name, age })); // pass function into the foreach

  function passInfo(item, idx, ...args) {
    console.log({ item, idx, args });
  }
})();



// another example

const test = [3, 5, 6, 7, 8, 0, "", null, undefined, "testing"];

test.forEach(listItem);


 function listItem(item, number, total) {
    return `<li class="${number}">${item} ${number} of ${total}</li>`;
  }

Not all browsers support forEach on NodeLists, but for those that do:

buttons.forEach((button) => {
  button.addEventListener('click', () => {
    console.log("forEach worked");
  });
});

bit deeper browser support.

var divs = document.querySelectorAll('div');
[].forEach.call(divs, function(div) {
  // do whatever
  div.style.color = "red";
});

JS

favMovies.forEach(function(favMovie) {
  console.log('I really like the movie', favMovie)
})