Javascript 变量未更改类内的属性

我正在制作一个像DVD屏幕一样弹跳的球类/对象。但是当球击中边缘时，控制其X和Y速度的变量不会改变

我已经尝试过在类外运行相同的IF语句，使用完全相同的名称和所有内容，然后它就工作了，但一旦在类内运行，它就会中断

var dvd1;
var dvd2;

function setup() {
  createCanvas(400, 400);
  dvd1 = new dvdlogo();
  dvd2 = new dvdlogo();
}

function draw() {
  background(255);
  dvd1.move(2, 3);
  dvd1.show(200, 200, 200);
  dvd2.move(3, 2);
  dvd2.show(255, 0, 0);
}

class dvdlogo {
  constructor() {
    this.x = 0;
    this.y = 0;
  }

  move(speedX, speedY) {
    this.x = this.x + speedX;
    this.y = this.y + speedY;

//speedX and Y arn't changing when the statement is true
    if (this.y >= height || this.y <= 0) {
      speedY = -speedY;
    }

    if (this.x >= width || this.x <= 0) {
      speedX = -speedX;
    }
  }

  show(r, g, b) {
    noStroke();
    fill(r, g, b);
    ellipse(this.x, this.y, 50, 50);
  }
}

这就是球应该做的： 他们就是这样做的：

如果您知道如何修复，请在此处告诉我如果您在web编辑器中更改代码，它不会提前将更改发送给我thx和speedX不是全局变量，它们是函数move的参数。speedY=-speedY更改参数的值，但这不会影响使用常量dvd1.move2，3；调用函数；。 speedX和speedY的值始终分别为2和3，因为函数move是用这个常量值调用的

将.speedX和.speedY属性添加到类DVD徽标中，并使用属性而不是参数：

function setup() {
    createCanvas(400, 400);
    dvd1 = new dvdlogo(2, 3);
    dvd2 = new dvdlogo(3, 2);
}

function draw() {
    background(255);
    dvd1.move();
    dvd1.show(200, 200, 200);
    dvd2.move();
    dvd2.show(255, 0, 0);
}

你太近了

您正在使用.move函数在每个帧中传递xSpeed和ySpeed，这使得您的if语句变得多余

我建议在构造函数中指定xSpeed和ySpeed，这样它就可以为您存储在对象中，这样您的if语句就可以直接更改字段了

var dvd1； var dvd2； 功能设置{ CreateCanvas400400； dvd1=新的dvdlogo2，3； dvd2=新的dvdlogo3，2； } 函数图{ 背景255； dvd1.move； dvd1.show200200200； dvd2.move； dvd2.255,0,0； } 类dvd标志{ 构造器X速度，Y速度{ 这个.x=0； 这个。y=0； this.speedX=xSpeed； 这个.speedY=y速度； } 移动{ this.x=this.x+this.speedX； this.y=this.y+this.speedY；

---

如果this.y>=height | | | this.y=width | | | | this.x似乎是一个简单的作用域问题。传递给move函数的speedX和speedY变量仅在函数内更改，传递的引用从未更改-我猜：-完全相同的解决方案。但这是显而易见的。+1

class dvdlogo {
    constructor(speedX, speedY) {
        this.x = 0;
        this.y = 0;
        this.speedX = speedX;
        this.speedY = speedY;
    }

    move() {
        this.x = this.x + this.speedX;
        this.y = this.y + this.speedY;

        if (this.y >= height || this.y <= 0) {
            this.speedY = -this.speedY;
        }

        if (this.x >= width || this.x <= 0) {
            this.speedX = -this.speedX;
        }
    }