JavaScript

requestAnimationFrame and “this”

How to call requestAnimationFrame with a this:

A = ->
  @animate()

A::animate = ->
  requestAnimationFrame @animate
a = new A()
// log: Uncaught TypeError: Failed to execute 'requestAnimationFrame' on 'Window': The callback provided as parameter 1 is not a function.

This doesn’t work because when requestAnimationFrame calls this.animate in its stomach, this is no longer the instance.

Instead, use

A::animate = ->
  requestAnimationFrame =>
    @animate()

It’s the same as setTimeout, or any other function that calls another function by its name: beware of where its this point towards.

Standard