How can I pass argument with requestAnimationFrame?

Question

In the main program I randomly choose an object which I'd like to animate, so I call the function with the object as the argument. The first loop is okay, x is finely set, but in the next turn it becomes undefined.

Something like this:

var anim = {         mainFunc: function(x) {             anim.update(x);             anim.redraw(x);             window.requestAnimationFrame(anim.mainFunc);         },          update: function(x) {          },          redraw: function(x) {          } };  var n=Math.floor(Math.random() * (ArrayOfAnimObject.length)); anim.mainFunc(ArrayOfAnimObject[n]); 

Answer 1

You either need to create a reference or wrap the function call in another function like so:

mainFunc: function(x) {     anim.update(x);     anim.redraw(x);     window.requestAnimationFrame(function() {         anim.mainFunc(x);     }); } 

Answer 2

You can also use .bind.

mainFunc: function(x) {     anim.update(x);     anim.redraw(x);     window.requestAnimationFrame(anim.mainFunc.bind(anim,x)); }