HTML5-Javascript动画不适用于Mozilla但适用于Chrome

Question

我试图用HTML5画布为牛做一个简单的动画。该代码适用于谷歌浏览器，但不适用于Mozilla Firefox，Safari等。我的功能（代码）如下：

function animalView(objectToMove) {
  var canvas = document.getElementById('canvas'),
    context = canvas.getContext('2d');
  this.a = 0;
  (function() {
    var requestAnimationFrame = window.requestAnimationFrame ||
      window.mozRequestAnimationFrame ||
      window.webkitRequestAnimationFrame || window.msRequestAnimationFrame;
    window.requestAnimationFrame = requestAnimationFrame;
  })();
  (function drawFrame() {
    window.requestAnimationFrame(drawFrame, canvas);
    context.save();
    context.clearRect(0, 0, canvas.width, canvas.height);
    this.a += 10;
    objectToMove.tail = Math.sin( this.a );
    objectToMove.draw(context);
    context.restore();
  }());
}

我注意到当回调函数调用this.a时，function()的值不会被记住。