Javascript 在同一时间移动同一个圆？

我正在使用html和javascript制作一个游戏，我已经在这上面呆了一段时间了，这段代码是关于让敌人从屏幕的一边移动到另一边的，这不是问题，因为我已经用其他角色做过了。最大的问题是我不能克隆它们并让它们独立移动

var canvas=document.getElementById（'canvas'）；
var h=画布高度；
var w=画布宽度；
var ctx=canvas.getContext（“2d”）；
变量x=w
变量y=数学地板（（数学随机（）*500）+1）；
清除（）；
圈（）；
函数clear（）{
ctx.fillStyle=“蓝色”
ctx.fillRect（0，0，w，h）
}
函数circleE（）{
ctx.fillStyle=“粉红色”；
ctx.beginPath（）；
弧（x，y，15，0，数学π*2，假）；
ctx.closePath（）；
ctx.fill（）；
}

---

因为它们共享x和y坐标，所以所有克隆都将在完全相同的空间中渲染。每个圆都需要有自己的坐标

var canvas=document.getElementById（'canvas'）；
var h=画布高度；
var w=画布宽度；
var ctx=canvas.getContext（“2d”）；
清除（）；
函数clear（）{
ctx.fillStyle=“蓝色”
ctx.fillRect（0，0，w，h）
}
函数circleE（）{
var x=数学地板（（数学随机（）*w）+1）；
变量y=数学楼层（（数学随机（）*h）+1）；
ctx.fillStyle=“粉红色”；
ctx.beginPath（）；
弧（x，y，15，0，数学π*2，假）；
ctx.closePath（）；
ctx.fill（）；
}

Spawn

因为它们共享x和y坐标，所以所有克隆都将在完全相同的空间中渲染。每个圆都需要有自己的坐标

var canvas=document.getElementById（'canvas'）；
var h=画布高度；
var w=画布宽度；
var ctx=canvas.getContext（“2d”）；
清除（）；
函数clear（）{
ctx.fillStyle=“蓝色”
ctx.fillRect（0，0，w，h）
}
函数circleE（）{
var x=数学地板（（数学随机（）*w）+1）；
变量y=数学楼层（（数学随机（）*h）+1）；
ctx.fillStyle=“粉红色”；
ctx.beginPath（）；
弧（x，y，15，0，数学π*2，假）；
ctx.closePath（）；
ctx.fill（）；
}

Spawn

如果我尝试了一个数组，但失败了，我该怎么做呢？你建议做什么取决于你想做的事情有多复杂，以及圆圈需要做什么。在我的代码片段中，我只是随机化了x和y，但是您可以创建一个圆形对象，每个对象都将坐标作为其属性。如果你正在制作多个圆的动画，理想情况下你会这么做。很久以前，我写了一个与你的问题不同的答案，但实际的解决方案可能会帮助你，请看这里：我怎么做我尝试了一个数组，但失败了你会建议什么取决于你想要的复杂程度，以及圆需要做什么。在我的代码片段中，我只是随机化了x和y，但是您可以创建一个圆形对象，每个对象都将坐标作为其属性。如果你正在制作多个圆的动画，理想情况下你会这么做。很久以前，我写了一个与你的问题不同的答案，但实际的解决方案可能会对你有所帮助，请看这里：