我正在尝试制作一个简单版本的flappy bird来帮助我学习JavaScript。我使用的是p5.js。我已经为在屏幕上移动的墙创建了一个构造函数,代码如下:
function Wall() {
this.xw = width- 20;
this.width = 20;
this.len = Math.floor(Math.random() * 200) + 50
this.rects = function() {
rect(this.xw,0,this.width,this.len);
translate(0,height);
rect(this.xw,0,this.width,-height + 70 + this.len);
}
this.update = function(){
this .xw -= 1;
}
}
我想让这些对象在我使用这段代码尝试完成后在屏幕上移动。然而,我的问题是它只生成了一面墙。
if(frameCount % 40 == 0) {
walls.push(new Wall());
}
for(i = 0; i < walls.length; i++){
walls[i].rects();
walls[i].update();
}
我还创建了一个空数组,并在设置函数中写道:
var walls = [];
walls.push(new Wall());
任何帮助都是非常感谢的。
发布于 2018-08-07 07:06:01
已经有一段时间了,但如果你还被困在这里,我注意到了一些东西。
看起来你的函数没问题,但是你有一个小的拼写错误。在调用update
方法时,额外的空间会阻止this.xw
递减(使用this .xw
而不是this.xw
)。
您可以在控制台中键入walls.length
并观察每面墙是否添加到阵列中来进行确认。但是,它们都堆叠在彼此的顶部(z轴)上,位置相同,因为每面墙的xw
属性都没有改变。
为了清楚起见,下面是更改:
function Wall() {
this.xw = width- 20;
this.width = 20;
this.len = Math.floor(Math.random() * 200) + 50
this.rects = function() {
rect(this.xw,0,this.width,this.len);
translate(0,height);
rect(this.xw,0,this.width,-height + 70 + this.len);
}
this.update = function(){
this.xw -= 1; // <-- this line here, remove the space
}
}
https://stackoverflow.com/questions/51409355
复制相似问题