Posso eseguire queste funzioni annidate in un modo migliore?

Question

Mi chiedevo se potevo correre questo funzioni in un modo migliore, voglio dire che non mi piace la raccolta di funzioni in là:

setTimeout(function() { 
     $(self.header_buttons_classes[0]).addClass(self.animations[15]); 
     setTimeout(function() { 
      $(self.header_buttons_classes[1]).addClass(self.animations[15]); 
      setTimeout(function() { 
       $(self.header_buttons_classes[2]).addClass(self.animations[15]); 
       setTimeout(function() { 
        $(self.header_buttons_classes[3]).addClass(self.animations[15]); 
        setTimeout(function() { 
         $(self.header_buttons_classes[4]).addClass(self.animations[15]); 
         setTimeout(function() { 
          $(self.header_buttons_classes[5]).addClass(self.animations[15]); 
         }, 500); 
        }, 500); 
       }, 500); 
      }, 500); 
     }, 500); 
    }, 500); 

Answer 1

Oltre a setTimeout v'è anche la funzione che permette setInterval per eseguire il codice ogni X millisecondi. È possibile semplificare il codice come segue:

var i = 0; 
var total = self.header_buttons_classes.length; 
var x = setInterval(function() { 
    if(i == total) { 
     clearInterval(x); 
    } else { 
     $(self.header_buttons_classes[i]).addClass(self.animations[15]); 
     i++; 
    } 
}, 500);