javascript - 尝试将动画重构为类对象，如何构造其相互关联的部分

Question

我正在尝试将一些动画代码重构为类对象，以便可以实例化它。

原始代码只是一个包含一些函数和变量的文件，它从函数中调用变量，这结果是有点问题，因为代码的其中一个内容是要填充的构造函数一个数组。

我对如何将此方面放入新类构造函数中有点困惑，因为这个迷你类 Particle 有一个自己的方法，称为 .use，其中包含一些 ctx 变量。但是它们如何指向函数其余部分中包含的 ctx 信息，因为所有这些信息都在另一个作用域区域中？

我尝试使用像 DrawSlinky.prototype.Particle.use 这样的原型(prototype)添加 .use 方法，当它到达应该调用此函数的点时，它说它不是一个函数，所以我想这不起作用。

这是现在的代码，错误如下:

DrawSlinky.prototype.Particle = function(x, y, color, area, velocity, rad){
  this.x = x;
  this.y = y;
  this.vx = Math.cos(rad) * velocity;
  this.vy = Math.sin(rad) * velocity;
  this.color = color;
  this.area = area;
  this.use = function(){
    this.x += this.vx *= .99;
    this.y += this.vy *= .99;
    this.ctx.fillStyle = ctx.shadowColor = this.color;
    this.ctx.shadowBlur = this.area;
    this.ctx.beginPath();
    this.ctx.arc(this.x, this.y, this.area/2, 0, Math.PI*2);
    this.ctx.fill();
  }
};

这给我一个错误，指出 ctx 属性未定义。如何解决此问题并访问 .Particle 迷你构造函数之外的对象其​​余部分中的 ctx 信息？

Answer 1

这就像处理其他语言中的 super 一样。要访问 super 数据，请使用:

this.constructor