处理可汗学院 vs 处理 2

Question

所以我在 khan-academy 上做了这个，并想把它放在我的网站上。

https://www.khanacademy.org/cs/fade-away/4830224329998336

为了将其转换为 JavaScript，我将下面的代码放入其中。不幸的是我收到错误：您正在混合主动和静态模式。为什么这适用于可汗学院处理而不是正常处理？另外我还可以通过什么其他方式编写它来使其工作？

//don't forget to click!!!
background(2, 3, 3);

strokeWeight(2);
var x = random;

void setup(){
  size(500,500);
}




void draw(){
   fill(0, 0, 0, 20);
   rect(0,0, 400,400);
    var randomSize = random(20, 60);

     if (mouseIsPressed) { 

        noStroke();
        fill(random(0, 255), random(0, 255), random(0, 255), 373);

        } 

    else {
        noStroke();
        fill(255, 0, 0, 15);
        randomSize=50;
    }
    ellipse(mouseX, mouseY, randomSize, randomSize);
};

Answer 1

您的代码存在几个问题。首先，你不能在外部进行函数调用 draw() 和 setup()——这就是导致“主动与静态”错误的原因。将它们移到里面 setup(). 。其次，不存在这样的事情 mouseIsPressed 处理中，但有 mousePressed. 。您也不需要在右大括号后加分号 draw(). 。您还可以使用硬编码值 400 用于绘制矩形，而窗口本身是 500X500. 。无论如何，你不应该使用这样的硬编码数字，使用内置的 width 和 height 常数。最后，你永远不会使用变量 x, ，所以我把它注释掉了。这是有效的代码（并且已清理，格式化）。

//don't forget to click!!!

void setup() {
  size(500, 500);
  background(2, 3, 3);
  strokeWeight(2);
  //var x = random;
}

void draw() {
  fill(0, 0, 0, 20);
  rect(0, 0, width, height);
  var randomSize = random(20, 60);
  noStroke();

  if (mousePressed) { 
    fill(random(0, 255), random(0, 255), random(0, 255), 373);
  }  else {
    fill(255, 0, 0, 15);
    randomSize=50;
  }
  ellipse(mouseX, mouseY, randomSize, randomSize);
}