javascript - 声明为原型(prototype)的函数显示为未定义

Question

我有这段代码，其中有一个粒子对象和一个保存其所有实例的数组。然后，我尝试创建一个函数来调用每个实例的 draw() 和 update() 函数。:

var particles;
function setup() {
    createCanvas(window.innerWidth, window.innerHeight);
    particles = [];
    for (var i = 0; i < 5; i++) {
        particles.push(1);
    }
};
function particle() {
    this.x = random(0, width);
    this.y = random(0, height);
};
particle.prototype.draw = function() {
    noStroke();
    fill(255, 0, 0);
    rect(this.x, this.y, 20, 20);
};
particle.prototype.update = function() {
    this.x+=random(-0.1, 0.1);
    this.y+=random(-0.1, 0.1);
};
Array.prototype.run = function() {
    for (var i = 0; i < this.length; i++) {
        this[i].update();
        this[i].draw();
    }
};

function draw() {
    background(255);
    particles.run();
};

这是我的错误消息:this[i].update 不是函数。如果我记录该函数，它是“未定义”的。这与我将其声明为原型(prototype)有什么关系吗？我也知道修改 Array 对象通常是不好的做法，但到​​目前为止我不知道创建可直接在数组上使用的函数的其他方法。除了 p5 库之外，我没有使用任何库或内容。最有效/最干净的解决方案是什么？

Answer 1

我假设您实际上希望粒子成为粒子的数组

注释1:仅将run添加到articles数组的代码仅

注 2:将 article 更改为 Particle - 仅出于“约定”原因

var particles;
function setup() {
    createCanvas(window.innerWidth, window.innerHeight);
    particles = [];
    for (var i = 0; i < 5; i++) {
        particles.push(new Particle);
    }
};
function Particle() {
    this.x = random(0, width);
    this.y = random(0, height);
};
Particle.prototype.draw = function() {
    noStroke();
    fill(255, 0, 0);
    rect(this.x, this.y, 20, 20);
};
Particle.prototype.update = function() {
    this.x+=random(-0.1, 0.1);
    this.y+=random(-0.1, 0.1);
};
// add run to particles, not to Array.prototype
Object.defineProperty(particles, 'run', {
    value: function() {
        for (var i = 0; i < this.length; i++) {
            this[i].update();
            this[i].draw();
        }
    }
});

function draw() {
    background(255);
    particles.run();
};