Question

我不太了解if / else条件。谁能解释其逻辑/原因为何起作用，为什么不起作用？我的目标是使用p5.js在屏幕上简单地移动圆圈并再次返回，但是如果有条件的话，我无法让它执行第二个步骤。

我尝试将条件设置为宽度，但我认为这将不起作用，因为它会卡住。我认为第二个条件的问题更多，因为第一个条件的工作与第二个条件相同。

var circlex = 18;

function setup() {
  createCanvas(400, 400);
  //background(255);
  framerate = 10;
  //noLoop();
}

function draw() {
  background(255);
  strokeWeight(10);
  //stroke(random(255));
  // for (var circleX = 20; circleX < width; circleX += 40) {
  //fill ((0), random(255), random(255));

  ellipse(circlex, 200, 25, 25);
  if (circlex < 250) {
    circlex = circlex + 50;
  } else if (circlex > 390) {
    circlex = circlex - 50;
  }
}

从本质上讲，这是第一个子午线运行，但椭圆在250处停止并且不再移动，因此完全没有设法使它走另一条路。我认为这是由于我缺乏知识和理解，所以如果有人能够解释这有什么坏处，我将非常感激。谢谢！

我想以某种方式在x轴上移动椭圆，然后将其返回，好像它在两者之间反弹一样，但实际上它只是移动到第一个条件中设置的250，就好像第二个条件不存在一样

Answer 1

当circlex的值介于250和390之间时，两个if条件都不成立，因此不会更新circlex椭圆卡住了。

您应该具有另一个全局变量，该变量指定椭圆应移动的距离，并将其无条件地添加到circlex中。仅应使用条件来更改此变量的符号-当您达到250以下时，它变为正，而当您高于390以上时，它变为负。

var circlex = 18;
var deltax = 50;

function setup() {
  createCanvas(400, 400);
  //background(255);
  framerate = 10;
  //noLoop();
}

function draw() {
  background(255);
  strokeWeight(10);
  //stroke(random(255));
  // for (var circleX = 20; circleX < width; circleX += 40) {
  //fill ((0), random(255), random(255));

  ellipse(circlex, 200, 25, 25);
  if (circlex < 250) {
    deltax = 50;
  } else if (circlex > 390) {
    deltax = - 50;
  }
  circlex += deltax;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.8.0/p5.min.js"></script>

对if / else if条件逻辑的误解

1 个答案: