Javascript 构造函数不工作？？P5.JS

所以我试图弄明白为什么它说display（）不是一个函数，我觉得这是一个完全错误的代码

还有，我对图像的x和y位置有点困惑？我在哪里定义它们

这段代码的目的是让一个冲锋队png在屏幕上浮动，我最终希望他在点击时发出声音，让他旋转（我也被难住了）——这里可以看到一个实时版本：（这是我的半成品作品集，请不要太苛刻）

我用不同的方法正确地编写了这段代码，我只是在学习构造函数。起初我很兴奋，因为我认为我终于掌握了“this”关键字，然后一切都崩溃了

function preload() {

img = loadImage("stormy3.png");

}

function storm(x,y,xSpeed,ySpeed,img) {
 this.x = x;
 this.y = y;
 this.xSpeed = xSpeed;
 this.ySpeed = ySpeed;
 this.img = img;

 this.display = function() {
  image(this.img,this.x,this.y);
}

this.move = function() {
  this.x = this.x + this.xSpeed;
  this.y = this.y + this.ySpeed;
}
this.bounce = function() {
  if(this.x > width || this.x < 0) {
    this.xSpeed = this.xSpeed * -1;
  }
  if(this.y > height || this.y < 0) {
    this.ySpeed = this.ySpeed * -1;
  }
}
}

function setup() {
 // TRANSPARENT BACKGROUND*
  background(255, 0, 0, 0.4);
//
var myCanvas = createCanvas(1440, 4000);
myCanvas.position(0, 0);
}

function draw() {
 // TRANSPARENT BACKGROUND*
 clear();
 //
 storm.display();
 storm.move();
 storm.bounce();
}

函数预加载（）{
img=loadImage（“stormy3.png”）；
}
功能风暴（x、y、x速度、y速度、img）{
这个.x=x；
这个。y=y；
this.xSpeed=xSpeed；
this.ySpeed=ySpeed；
this.img=img；
this.display=函数（）{
图像（this.img，this.x，this.y）；
}
this.move=函数（）{
this.x=this.x+this.xSpeed；
this.y=this.y+this.y速度；
}
this.bounce=函数（）{
if（this.x>宽度| | this.x<0）{
this.xSpeed=this.xSpeed*-1；
}
if（this.y>高度| | this.y<0）{
this.ySpeed=this.ySpeed*-1；
}
}
}
函数设置（）{
//透明背景*
背景（255,0,0,0.4）；
//
var myCanvas=createCanvas（14404000）；
myCanvas.position（0,0）；
}
函数绘图（）{
//透明背景*
清除（）；
//
storm.display（）；
storm.move（）；
风暴。反弹（）；
}

您已经创建了一个名为

storm

的构造函数，它定义了一个名为

storm

的类型。但您尚未创建该类型的实例

现在，当您执行此操作时：

storm.display();
storm.move();
storm.bounce();

此代码中的

storm

引用的是类型，而不是特定实例。这就是为什么你会出错。不能使用这样的类型调用函数，必须遍历一个实例

要创建实例，应使用

new

关键字：

var myStorm=新风暴（1002001,2，yourImageHere）

然后可以使用该实例调用函数：

myStorm.display();
myStorm.move();
myStorm.bounce();

几个随机注释：构造函数应该以大写字母开头，这样更容易区分类型和包含实例的变量之间的差异。此外，您从未定义过

img

变量，因此这会给您带来问题

---

无耻的自我推销：我写了一篇关于可用构造函数的教程。

你是如何构造

storm

？你有没有试过新的暴风雪（…）告诉我们暴风雪的定义是什么？是的，我完全搞砸了，这没有任何意义。谢谢你的深入回答，我也把教程打印出来阅读了。谢谢