p5.js调用UPDATE函数报错‘无法作为函数调用’，求代码排查

核心错误原因 #

你定义的UPDATE和render函数不在Rocket构造函数内部，而是直接挂在全局作用域的this（浏览器环境下即window对象）上，导致rocket实例没有这两个方法，调用时自然抛出“不是函数”的错误。

修复后的完整代码 #

function Rocket() {
    this.pos = createVector(width/2, height);
    this.vel = createVector(0, -1);
    this.acc = createVector();
    
    this.applyForce = function(force) {
        this.acc.add(force);
    };
    
    this.update = function() {
        this.vel.add(this.acc);
        this.pos.add(this.vel);
        this.acc.mult(0);
    };
    
    this.render = function(){
        push();
        translate(this.pos.x, this.pos.y);
        rotate(this.vel.heading()); 
        rectMode(CENTER);
        rect(0, 0, 50, 10);
        pop();
    };
}

function setup() {
    createCanvas(400, 300);
    rocket = new Rocket();
}

function draw() {
    background(0);
    rocket.update();
    rocket.render();
}

额外修复点 #

• p5.js的绘图API是小写命名：把Rect()改为rect()，Pop()改为pop()，否则会触发未定义函数错误。
• 遵循JavaScript命名规范：实例方法使用小驼峰命名（如update而非UPDATE），全大写通常用于常量定义，提升代码可读性。

内容的提问来源于stack exchange，提问作者Arnav saxena