Question

Is it possible to do the following using javascript/jquery?

using setInterval with an array of function names, if the array only has 1 function, it should do the following if the user opens the webpage at 10:00:00

function 1 - 10:00:00
function 1 - 10:00:01
function 1 - 10:00:02
function 1 - 10:00:03
function 1 - 10:00:04

then if the user clicks another button, a new function name gets added to the array, which ends up doing the following:

function 1 - 10:00:05
function 2 - 10:00:06
function 1 - 10:00:07
function 2 - 10:00:08
function 1 - 10:00:09
function 2 - 10:00:10
function 1 - 10:00:11
function 2 - 10:00:12
function 1 - 10:00:13

if the user clicks the button a 3rd time, a new function name gets added to the array, which ends up doing the following:

function 1 - 10:00:14
function 2 - 10:00:15
function 3 - 10:00:16
function 1 - 10:00:17
function 2 - 10:00:18
function 3 - 10:00:19
function 1 - 10:00:20
function 2 - 10:00:21
function 3 - 10:00:22

Is this possible? If it is possible, could someone please help me with some example script on how to get this to happen?

Answer 1

A simple mechanism:

var intervalWork = (function() {
  var workers = [], wi = 0;
  var interval = setInterval(function() {
    if (!workers.length) return;
    workers[wi](wi);
    wi = (wi + 1) % workers.length;
  }, 60 * 1000);

  return function(w) {
    workers.push(w);
  };
})();

Then you have a function called “intervalWork” that allows a function to be added to the queue. One function per timer interval (60 seconds here) will be run. The functions are passed their index in the queue; that doesn’t seem generally interesting but it’d let you print out those messages.

The function would be called like this:

intervalWork(function(index) {
  // do interesting stuff
  console.log("Function " + index + " " + new Date());
});

Or you could call it and pass the name of an already-defined function:

intervalWork(someRandomFunction);

You could of course make this fancier and provide for other execution modes, or whatever. You didn’t describe the overall point of this code so I don’t really know what more you’d want.

edit — one more note: many people might (rightly) suggest that instead of a timer driven by the browser’s setInterval() mechanism, it might be better to use setTimeout() and do the work of setting up each subsequent timer yourself. That can be important in cases much like yours, where the amount of work done is sort-of unbounded because you don’t control what those “worker” functions do. The basic setup would be the same however.