p5.j​​s - random（），height和width未定义？

Question

我正在尝试使用p5.js使球在画布上反弹，但似乎未定义width，height和random()。 这是我的所有代码：

function setup() {
  createCanvas(640,480);
  background(240);
}

var dot = {
  x: random(width), 
  y: random(height), 
  size: 50,
  r: 255,
  g: 0,
  b: 0,
  speedX: 5,
  speedY: 5
};

function draw() {
  background(240);
  fill(dot.r, dot.g, dot.b);
  ellipse(dot.x, dot.y, dot.size, dot.size);
  if (dot.x >= 615 || dot.x <= 25) { //if the ball is out of screen horizontally
    dot.speedX = dot.speedX * -1;
  } 

  if (dot.y >= 465 || dot.y <= 25) { //if the ball is out of screen vertically
    dot.speedY = dot.speedY * -1;
  }

  dot.x = dot.x + dot.speedX;
  dot.y = dot.y + dot.speedY;
}

如果我使用JavaScript的Math.random，它可以正常工作。此外，如果我手动输入宽度和高度作为数字（640和480），它工作正常。 p5.j​​s不应自动分配height，width，random等吗？ 发生了什么事？

Answer 1

您不能使用P5.js函数或变量（包括width，height和random()），直到之后 {{1} } 叫做。那是因为P5.js还没有加载，所以它们没有被定义。您必须确保在调用setup()之后调用P5.js函数或变量。

在您的情况下，您直接在顶层定义setup()，这在dot被调用之前就开始了。您可以通过在setup()定义旁边以及console.println()函数内放置dot来调试此问题。

基本上，要解决此问题，只需将setup()的初始化移至dot函数内：

setup()

您可以在the P5.js FAQ中了解详情。