Класс с использованием canvas

function getRandom(min, max)
{
    return Math.floor(min + Math.random() * (max + 1 - min));
}
 
 
var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");
 
canvas.width = window.innerWidth - 25;
canvas.height = window. innerHeight - 25;
 
 
class Star
{
    constructor()
    {
        this.x = getRandom(25, window.innerWidth - 25);
        this.y = getRandom(25, window.innerHeight - 25);
 
        ctx.beginPath();
        ctx.fillStyle = "#fff";
        ctx.arc(this.x, this.y, 3, 0, 2 * Math.PI, true);
        ctx.fill();
 
        this.starMove();
    }
 
    starMove()
    {
        console.log(this.x);
        ctx.clearRect(this.x - 3 - 1, this.y - 3 - 1, 3 * 2 + 2, 3 * 2 + 2);
        ctx.fillStyle = "#fff";
        ctx.arc(this.x, this.y, 3, 0, 2 * Math.PI, true);
 
        if(this.y > window.innerHeight / 2)
        {
            this.y++;
        }
        else
        {
            this.y--;
        }
 
        if(this.x > window.innerWidth / 2)
        {
            this.x++;
        }
        else
        {
            this.x--;
        }
 
        window.requestAnimationFrame(this.starMove);
    }
}
 
var starCount = 5;
 
for(var i = 0; i < starCount; i++)
{
    new Star();
}

window.requestAnimationFrame(() => this.starMove);

window.requestAnimationFrame(this.starMove.bind(this));
// or
window.requestAnimationFrame(()=>this.starMove());