Making a shape a const, and using it multiple times in js

October 18, 2023

I’m trying to make a pixelated image by hand, but the editor im using does not allow copy and pasting, which means I have to type everything by hand, so defining a new rectangle each time I wanna use it is too much work.

What I tried was:

const grey = new Rectangle(10, 10);
grey.setPosition (100, 400);
grey.setColor ("#686968");
add (grey);
grey. setPosition (110, 400);
grey.setColor("#686968");
add (grey);

But instead of adding another grey square, it just moved the first one.

I also looked online and did not find anything that helped.

>Solution :

Create a function that makes the Rectangle for you, based on some parameters:

function getColoredRectangle(color, x, y, width = 10, height = 10, ) {
    const rect = new Rectangle(width, height);
    rect.setPosition(x, y);
    rect.setColor(color);
    return rect;
}

add(getColoredRectangle("#686968", 100, 400))
add(getColoredRectangle("#123456", 110, 400))