I have a class called invaders which hold the properties of an image. I want to take that class, make copies of said invaders and give them a new positions which is the “this.x” and “this.y”. I was able to push the class in an array and I have a loop that runs and controls the amount of enemies I want to be displayed, but I am unable to access their position in order to change it for lets the say the second invader.
I believe my loop runs fine because when I console log the length it does say the right amount so I think they are all stacked on top of each other which makes sense as I still can’t figure out how to change the position for each.
let invaderCount = 5
const allInvaders = []
class Invaders{
constructor(){
this.x = 200
this.y = 200
this.width = 50
this.height = 50
const image = new Image();
image.src = './image/invader.png'
this.image = image
}
draw(){
ctx.drawImage(this.image, this.x, this.y, this.width, this.height)
}
update(){
this.draw()
}
}
const invaders = new Invaders()
for(let i=0; i < invaderCount; i++){
allInvaders.push(invaders)
}
console.log(allInvaders.length)
function animate(){
requestAnimationFrame(animate)
invaders.update()
}
animate()