在连续函数中引用全局变量(p5.js)

Question

我已经很多年没有编码了，现在我需要拿起p5.js。作为练习，我试图制作一个简单的绘图程序-我希望我的程序默认以黑色绘制，并在点击屏幕角落的红色矩形时将颜色切换为红色。我的代码非常潦草(游戏邦注:我知道鼠标按键与红色矩形并不完全对齐，"绘图"机制也不是最好的，等等)。我只是随便摆弄一下)

function setup() {
	createCanvas(600, 600);
	fill ('red'); 
  	rect(570,20,5,5);
  //creates red rectangle at top right corner of screen
}
var color = 0;
function mousePressed(){
	if ( mouseX > 570) {
  		if( mouseY > 20){
  			color = 4;
  			ellipse (10,20,50,50);
  		}
  		
  	}
}
function draw() {
	
  stroke(color);
  if (mouseIsPressed) {
  	ellipse(mouseX, mouseY, 1, 1)
  	//creates colored dot when mouse is pressed
  } 
}
function keyTyped(){
	if (key === 'c'){
		clear();
	}
}

如果我不使用'color'变量，而只是将描边设置为0，我可以用黑色画得很好。mousePressed函数似乎起作用了——当我按下矩形时，它会画出我要测试的椭圆。然而，我似乎不能在我的绘制函数中引用var 'color' -这可能是一个愚蠢的问题，但我承认被难住了!我做错了什么?

Answer 1

在命名变量时必须小心。特别是，您不应该将它们命名为与现有函数相同的东西!

摘自process .js帮助文章:

JavaScript的一个强大特性是动态的、无类型的特性。像Java这样的类型化语言，以及Processing，可以重用名字而不用担心歧义(例如，方法重载)，Processing.js却不能。在不深入了解JavaScript内部工作原理的情况下，对Processing开发人员最好的建议是不要使用函数/类等。处理过程中的名称作为变量名。例如，一个名为line的变量可能看起来很合理，但它会导致内置在Processing和Processing.js中的同名相似的line()函数出现问题。

Processing.js是JavaScript，所以函数可以存储在变量中。例如，color变量是color()函数!因此，当您创建自己的color变量时，您将覆盖它，因此您将失去调用color()函数的能力。

最简单的解决方法是将color变量的名称更改为myColor。