S2JS - Control: functions, loops, if-then-else : After a while

The program keeps doing the while loop until the test condition is no longer true, and only then does it get started on the statements that are listed after the end of the while.

In this example, notice how there's 20 unfilled rectangles, but only one filled rectangle.

That's because the fillRect is outside the while loop, but the strokeRect occurs inside the loop.

<HTML> <head> <title> My new Web Page </title> </head> <body> <canvas id=myCanvas width=300 height=300 style="background-color: pink;"> </canvas> <script> var ctx = myCanvas.getContext("2d"); var corner= 0; while (corner < 100) { ctx.strokeRect(corner, corner, 50, 50); corner= corner + 5; } ctx.fillRect(corner, corner, 50, 50); </script> </body> </html>