Javascript p5.js–;按键功能和更改y坐标有困难

Javascript p5.js–;按键功能和更改y坐标有困难,javascript,if-statement,keyboard-events,p5.js,Javascript,If Statement,Keyboard Events,P5.js,当涉及到任何与编程相关的事情时,我是一个初学者;我完全没有任何经验。考虑到这一点,我有一项任务,我一直在拼命想办法完成——制作一款功能齐全的太空射击游戏,类似于Galaga或太空入侵者。不幸的是,我被卡住了。(真是个惊喜,对吧?) 我在这方面进展甚微,但我最近遇到的困难是试图排除故障并找出为什么我非常恰当地指定为“玩家”飞船的对象不会上下移动。我不完全确定我应该寻找什么——这是程序解释键盘输入方式的问题吗?坐标有什么问题,我根本认不出来吗?也许是变量的范围 在任何情况下,都会使用名为Ship()

当涉及到任何与编程相关的事情时,我是一个初学者;我完全没有任何经验。考虑到这一点,我有一项任务,我一直在拼命想办法完成——制作一款功能齐全的太空射击游戏,类似于Galaga或太空入侵者。不幸的是,我被卡住了。(真是个惊喜,对吧?)

我在这方面进展甚微,但我最近遇到的困难是试图排除故障并找出为什么我非常恰当地指定为“玩家”飞船的对象不会上下移动。我不完全确定我应该寻找什么——这是程序解释键盘输入方式的问题吗?坐标有什么问题,我根本认不出来吗?也许是变量的范围

在任何情况下,都会使用名为Ship()的构造函数调用对象–对象本身是一个三角形。(我说过我宁愿不要浪费时间去尝试弄清楚复杂的形状,因为我有点傻,可能会很好地做到这一点?但我离题了。)我在六个不同的变量中指定了坐标,每个变量对应于三个顶点之一的x或y值。如果不存在任何相关性,画布大小为400像素乘以400像素

…回想起来,这可能没有多大意义

为了澄清,以下是
constructors.js
文件的所有部分,它与
sketch.js
中编写的主代码是分开的。我已经确保将它链接到HTML文件,以防有人想知道

/*
我没有将这些值设置为静态数字,而是选择了
动态设置它们,使三角形显示在
无论画布大小,相对位置相同:
*/
//第一个顶点的坐标-左下角
这1.x1=宽度*9/20;
该值为0.y1=高度*9/10;
//第二个顶点的坐标-顶中心
该值为0.x2=宽度/2;
这1.y2=高度*4/5;
//第三个顶点的坐标-右下角
这1.x3=宽度*11/20;
此点y3=高度*9/10;
//然后通过triangle()函数调用该形状:
this.show=函数(){
三角形(this.x1,this.y1,this.x2,this.y2,this.x3,this.y3);
};
我在一个包含变量的函数中编写了一个
if
语句,
move
,它与主文件中的keyPressed()函数相对应:

  // constructors.js
  this.move = function(dir) {
    if (key === 'a' || 'd') {
      if (this.x1 > 0 && this.x3 < width) {
        this.x1 += dir;
        this.x2 += dir;
        this.x3 += dir;
      }
    } else if (key === 'w' || 's') {
      if (this.y1 < height && this.y2 > 0) {
        this.y1 += dir;
        this.y2 += dir;
        this.y3 += dir;
      }
    }
  };

  // sketch.js
  function keyPressed() {
    // ship was initialised in setup() as an instance of Ship()
    let left = -5, right = 5,
        up = -2, down = 2;
    if (key === 'a') {
      ship.move(left);
    } else if (key === 'd') {
      ship.move(right);
    } else if (key === 'w') {
      ship.move(up);
    } else if (key === 's') {
      ship.move(down);
    }
//constructors.js
this.move=函数(dir){
如果(键=='a'| |'d'){
如果(this.x1>0和this.x30){
这是1.y1+=dir;
这是1.y2+=dir;
这是1.y3+=dir;
}
}
};
//sketch.js
功能键按下(){
//ship已在setup()中初始化为ship()的实例
设左=5,右=5,
向上=-2,向下=2;
如果(键=='a'){
船。移动(左);
}否则如果(键=='d'){
船。移动(右);
}否则如果(键=='w'){
上船,上船;
}否则如果(键=='s'){
上船,下船;
}
如果我还没有弄清楚这一点,其目的是让程序(软件?)处理来自键盘的用户输入,并相应地移动对象

我不完全确定发生了什么;出于某种原因,当我测试W和s键时,它们会导致飞船分别向左和向右移动两个像素,而不是向上和向下移动——这是预期的结果

问题是,我不能使用开发者控制台——我使用的设备是由一个组织拥有的,他们限制了对开发工具的访问——但即使我可以,我对它还不够熟悉,目前还不能使用它。然而,考虑到代码,我甚至不知道我是否会收到错误消息(现在)不会导致程序崩溃。这是我决定寻求帮助的主要原因

如果您能提供任何建议或建议,或者您能确定我应该编辑的代码部分,我将不胜感激

非常感谢大家


(顺便说一句,我希望你们明白,我并不是在要求一个完整的解决方案;我也不打算得到一个。但是,有人提供一些调试过的代码的可能性很小(再说一次,我不希望有人会不遗余力地这样做(尤其是对我来说,对所有人来说)),我不得不要求您提供一个透彻的解释,概述了这两段代码之间的差异,详细说明了错误发生的位置和原因。我想让这尽可能多地成为我自己的一次学习经历,因为我通常不欣赏那些利用错误的人这都是因为错误的if语句。 如果(键=='a'| |'d')不能使用
if
在此语句中,代码检查
是否等于
'a'
字符,或者
'd'
字符是否存在。 这就是为什么在所有情况下,即使您按下
adsw
'd'
都存在,并且如果语句为真。 如果您将代码更改为

   if (key === 'a' || key === 'd') {
      if (this.x1 > 0 && this.x3 < width) {
          this.x1 += dir;
          this.x2 += dir;
          this.x3 += dir;
      }
   } 
   else if (key === 'w' || key === 's') {
      if (this.y1 < height && this.y2 > 0) {
          this.y1 += dir;
          this.y2 += dir;
          this.y3 += dir;
      }
   }

if(key=='a'| | key=='d'){
如果(this.x1>0和this.x30){
这是1.y1+=dir;
这是1.y2+=dir;
这是1.y3+=dir;
}
}
一切都会很顺利