Math.floor() rounds its parameter down to the nearest integer value and returns that. The parameter can be an expression, or a value. Here are some examples:
Math.floor(3) --> 3
Math.floor(5.3) --> 5
Math.floor(5.9) --> 5
Math.floor(5 + 5.2) --> 10
The reason that we are using Math.floor is because in order to assign an element to a position on our canvas, we need a pair integer values as coordinates. We use
Math.floor() to round our values to the nearest integer, and then turn them into acceptable
y coordinates for our grid by rounding them to the nearest multiple of 10 in order to add some spacing between the elements of our game, and make it appear more like a grid.
This function you posted adds a piece of food to a random position.
First, we generate two random values to represent the x and y coordinates of our Food.
Randomizer.nextInt(x,y) accepts two values and returns and random value from between them. Our range is
(FOOD_RADIUS, getWidth() - FOOD_RADIUS) because we need to offset the position by
FOOD_RADIUS in both directions to make sure that none of it is hanging off the screen.
var x = Randomizer.nextInt(FOOD_RADIUS, getWidth() - FOOD_RADIUS);
var y = Randomizer.nextInt(FOOD_RADIUS, getHeight() - FOOD_RADIUS);
Now, we want our food to me nicely spaced and appear in an orderly fashion, so we need to round our coordinates to the nearest multiple of 10. So we divide by 10, use
Math.floor() to round the values, and multiply by 10. Finally, we add FOOD_RADIUS in order to center the image at this coordinate:
x = Math.floor(x / 10) * 10 + FOOD_RADIUS;
y = Math.floor(y / 10) * 10 + FOOD_RADIUS;
And finally, set the position of the graphics object:
Let me know if you have any more questions!