更新对象的JavaScript中

Question

定义我是相当新的面向对象的东西，所以这很可能是错误的方式是想约能完成这一操作。

这是什么，我现在有一个非常简化版本，但在概念本质上是相同的。当用户在我的页面上点击一个画布元素时，我在下面创建了20个粒子对象实例，将它们追加到一个数组中，同时以30FPS更新画布并基于每个实例的x属性绘制圆圈目的。一旦粒子离开屏幕，它将从阵列中移除。

var particle = function() 
{ 
    var _this = this; 
    this.velocity = 1; 
    this.x = 0; 

    this.updateVelocity = function(newVelocity) 
    { 
     _this.multiplier = newVelocity; 
    } 

    var updateObject = function() 
    { 
     _this.x += velocity; 
    } 

} 

我希望用户能够控制使用页面上的输入元素创建的新粒子的速度。当这个更新时，我有一个事件监听器调用

particle.updateVelocity(whateverTheUserEntered); 

但是，我得到错误“粒子没有方法updateVelocity”。在了解了这个主题之后，我明白要调用这个函数，我需要创建一个对象的实例，但这只会更新那个不适合我的实例的速度值。

我的问题是，有没有办法实现我在做什么或曾经我完全错误的方式接近这一点？正如我所说的，我仍然得到，所以我可能只是回答我自己的问题与OOP原则交手......

Answer 1

试试这个：

var particle = new (function() 
{ 
    var _this = this; 
    this.velocity = 1; 
    this.x = 0; 

    this.updateVelocity = function(newVelocity) 
    { 
     _this.multiplier = newVelocity; 
    } 

    var updateObject = function() 
    { 
     _this.x += velocity; 
    } 

})(); 

你的是创建一个函数，然后设置变量粒子到那个值。因此，particle不会有任何特殊的属性。我上面的例子，但是，通过使用new和作为构造函数的函数为particle分配了一个（现在是匿名）类的实例。

Answer 2

如果将其更改为

var particle = new function() { 

    } 

的一个实例的“新”会创作。

所以创建一个新建立的实例粒子为你的函数。

Answer 3

制作速度静有一个静态方法来更新它。这样，您仍然可以制作粒子的实例并更新所有这些粒子的速度。

var particle = function() { 
    // particle stuff 
} 
particle.velocity = 1; 
particle.updateVelocity = function(newVelocity) { 
    this.velocity = newVelocity 
} 

Answer 4

我想你想要的是：

// define a particle "class" 
function Particle() { 
    var _this = {}; 

    _this.velocity = 1; 
    _this.x = 0; 
    _this.multiplier = 1; 

    _this.updateVelocity = function(newVelocity) 
    { 
     _this.multiplier = newVelocity; 
    } 

    _this.updateObject = function() 
    { 
     _this.x += velocity; 
    } 

    return _this; 
} 

// make 1 particle 
var myParticle = new Particle(); 
myParticle.updateVelocity(100); 

// make a bunch of particles 
var myParticles = []; 
for (var i=0; i < 100; i++) { 
    var p = new Particle(); 
    p.updateVelocity(Math.random * 100); 
    myParticles.push(p); 
}