Javascript 画布对象不更改X位置？

我试图在每个

draw（）

上将对象的X位置更改1。然而，椭圆没有移动，我没有得到任何错误

函数设置（）{
createCanvas（窗口宽度，窗口高度-4）；
}
函数windowResized（）{
调整画布大小（窗口宽度，窗口高度-4）；
}
函数绘图（）{
背景（51,51,51）；
变量el1={
x:100，
y:100，
宽度：50，
身高：50
};
变量el2={
x:300，
y:300，
宽度：50，
身高：50
};
椭圆（el1.x，el1.y，el1.width，el1.height）；
椭圆（el2.x，el2.y，el2.width，el2.height）；
el1.x=el1.x+1；
}

---

您正在每帧重新创建

el1

和

el2

变量，因此您将以默认值重新启动它们

如果要修改单个

el1

变量，则需要在草图顶部声明它

比较此代码：

function draw(){
  var x = 42;
  console.log(x); // always prints 42
  x = x + 1;
}

var x = 42;

function draw(){
  console.log(x);
  x = x + 1;
}

根据本守则：

function draw(){
  var x = 42;
  console.log(x); // always prints 42
  x = x + 1;
}

var x = 42;

function draw(){
  console.log(x);
  x = x + 1;
}