无法引用在 setup() 中声明的变量

Question

我最近尝试进入 p5.js，在我从事的第一个项目中，我遇到了一个完全不正常的问题，无论出于何种原因，我在网上其他任何地方都没有提到这个问题。

我在 setup() 之外定义的任何变量都将是未定义的，但这是众所周知的事实。问题是我在 setup() 中定义的任何变量也将是未定义的，这意味着我根本不能使用任何变量。

代码如下：

function setup() {
  const canvasRatio = 0.975;
  createCanvas(int(windowWidth*canvasRatio), int(windowHeight*canvasRatio));
  fill(0);
  strokeWeight(2);
  var plyMov = createVector(0,0,0);
  var plyPos = createVector(0,0,0);
  const plySpd = 1;
  const plyEnable = 0;
}

function draw() {
  background(0);
  drawPly();
}

function drawPly(){
  plyPos=createVector(plyPos.x+plyMov.x,plyPos.y+plyMov.y,0)
  plyMov=createVector(0,0,0);
  stroke(255,0,0);
  ellipse(int(width/2),int(height/2),80, 80);
}

这是 vscode 中 chrome 的追溯：

ReferenceError: plyPos is not defined
    at drawPly (https://magicgonads.github.io/p5test/sketch.js:18:23)
    at draw (https://magicgonads.github.io/p5test/sketch.js:14:3)
    at p5.redraw (https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.8/p5.js:16560:7)
    at p5.<anonymous> (https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.8/p5.js:11593:12)
    at p5.<anonymous> (https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.8/p5.js:11489:12)
    at new p5 (https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.8/p5.js:11769:12)
    at _globalInit (https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.8/p5.js:8048:7)

Answer 1

Any variable I define outside of setup() will be undefined, but that's a well known fact.

嗯，什么？这不是众所周知的事实。您可能是说您不能在设置之前使用 Processing 的函数，但这并不能阻止您在草图顶部定义变量。

如果您在 setup() 中定义变量，则它仅在 setup() 中可用。在任何函数内定义的任何变量都是如此。

如果你想在多个函数中使用一个变量，你应该在草图级别定义它。您仍然可以在 setup() 函数中 初始化 它（给它一个值）：

var plyPos;
var plyMov;

function setup() {
  const canvasRatio = 0.975;
  createCanvas(int(windowWidth*canvasRatio), int(windowHeight*canvasRatio));
  fill(0);
  strokeWeight(2);
  plyMov = createVector(0,0,0);
  plyPos = createVector(0,0,0);
}

function draw() {
  background(0);
  drawPly();
}

function drawPly(){
  plyPos=createVector(plyPos.x+plyMov.x,plyPos.y+plyMov.y,0)
  plyMov=createVector(0,0,0);
  stroke(255,0,0);
  ellipse(int(width/2),int(height/2),80, 80);
}

无法引用在 setup() 中声明的变量

Can't reference variables declared in setup()

html

javascript

p5.js