I am currently studying the code for creating a canvas circle motion trail effect. I am a bit puzzled by the push(x:Pos,y:Pos) within thestoreLastPosition() function in the sample code provided below:
ctx = canvas.getContext('2d');
var xPos = -100, yPos = 170;
var motionTrailLength = 10;
var positions = [];
function storeLastPosition(xPos, yPos){
positions.push({
x: xPos,
y: yPos
});
if (positions.length > motionTrailLength){
positions.shift();
}
}
function update(){
ctx.clearRect(0, 0, canvas.width, canvas.height);
for(var i = 0; i < positions.length; i++){
ctx.beginPath();
ctx.arc(positions[i].x, positions[i].y, 50, 0, 2 * Math.PI);
ctx.fillStyle='green';
ctx.fill();
}
ctx.beginPath();
ctx.arc(xPos, yPos, 50, 0, Math.PI * 2);
ctx.fillStyle = "#FF6A6A";
ctx.fill();
storeLastPosition(xPos, yPos);
if (xPos > 600){
xPos = -100;
}
xPos += 3;
requestAnimationFrame(update);
}
update();
I am a little confused about the use of push() within the storeLastPosition() function. Is this method used to add object properties into the array?