Discussion of a calendar implementation in JavaScript

Our calendar is a table with numbers from 1 to the last day of the month. The problem is that the numbers in the table in the first row don't have to come from the first cell.

This is generally obvious. It's not obvious which cell to start with. Let's think.

Let the week start on Monday, and it is day zero. In this case, the number of the day of the week on the month first day corresponds to the number of empty cells before it. For example, Thursday will have the number 3 and preceded by 3 empty cells.

A similar problem will await us at the end of the table. There, too, you need to leave empty cells after the last day of the month. In this case, the number of empty cells will be equal to six, from which you need to subtract the day number of the week of the month last day.

Now let's think about how we will form our table. Obviously, it is most convenient to have a two-dimensional array, each sub-array of which will have 7 elements (= the number of days in a week). In this case, in the first and last subarrays, some of the elements must be empty.

Algorithm of actions

Let's make a function that will make an array of numbers from 1 to the last day of the month. Then we will make a function that will prepend the required number of empty elements to the beginning of the array. A similar function should append empty elements to the end of the array.

After that, we get a one-dimensional array with the number of elements that is a multiple of 7. Let's transform this array into two-dimensional with 7 elements in the subarray.

Then we take this two-dimensional array, loop through it and form our table.

We will perform this algorithm of actions step by step in the following lessons.