javascript - Nested setTimeout alternative?

Question

I need to execute 3 functions in a 1 sec delay.

for simplicity those functions are :

console.log('1');
console.log('2');
console.log('3');

I could do this: ( very ugly)

 console.log('1')
 setTimeout(function () {
     setTimeout(function () {
         console.log('2')
         setTimeout(function () {
             console.log('3')

         }, 1000)
     }, 1000)

 }, 1000)

Or I could create an array of functions and use setInterval with global counter.

Is there any elegant way of doing this ?

(p.s. function no.2 is not dependent on function number 1... hence - every sec execute the next function.).

Answer 1

You can use something like this with setTimeout:

var funcs = [func1, func2, func3],
    i = 0;

function callFuncs() {
    funcs[i++]();
    if (i < funcs.length) setTimeout(callFuncs, 1000);
}
setTimeout(callFuncs, 1000); //delay start 1 sec.

or start by just calling callFuncs() directly.

Update

An setInterval approach (be aware of the risk of call stacking):

var funcs = [func1, func2, func3],
    i = 0,
    timer = setInterval(callFuncs, 1000);

function callFuncs() {
    funcs[i++]();
    if (i === funcs.length) clearInterval(timer);
}