practica - clase

<meta charset="UTF-8">
<canvas width="600" height="400"></canvas>


<script>

    function vector(x, y, color){

        let screen = document.querySelector("canvas");
        let brush = screen.getContext("2d");

        brush.fillStyle = color; //propiedad
        brush.fillRect(x, y, 50, 50);//funcion
        brush.strokeStyle = "black";
        brush.strokeRect(x, y, 50, 50);

    }

    // var x = 0;
    // while(x < 600){

    //     vector(x, 0, "red");
    //     vector(x, 50, "yellow");
    //     vector(x, 100, "lightgreen");
    //     x = x + 50;

    // }

    // vector(0, 0, "red");
    // vector(0, 50, "yellow");
    // vector(0, 100, "lightgreen");

    for ( var x = 0; x < 600; x = x + 50){

        vector(x, 0, "red");
        vector(x, 50, "yellow");
        vector(x, 100, "lightgreen");

    }


</script>