javascript - 如何将日历开始日期布局从星期日更改为星期一？

Question

您好，我正在尝试从作者 xMark 的日历示例代码中学习 JavaScript。但他的示例使用星期日作为一周的第一天。我希望将星期一显示为一周的第一天。到目前为止，我只能更改标题标签，但不能更改日期的正确位置。 https://codepen.io/xmark/pen/WQaXdv

所以我一直试图理解在他的代码中我可以让日期向左移动一步。但我无法弄清楚这种转变应该发生在代码中的哪个位置。

我最困惑的部分是在 Calendar.prototype.showMonth = function(y, m) {...} 中，我认为这是需要更改的部分。在这个函数中我不明白为什么作者 var k = lastDay_of_LastMonth - firstDay_of_Month+1; 将+1添加到最后一个变量？

在var k = ...之后我完全迷失了。每当我尝试改变事情时，整个日历就会崩溃。

@纳吉布

var d7 = new Date(2018, 6, 1);
d7
"Sun Jul 01 2018" 00:00:00 GMT+0200 (Central European Summer Time)
 
var firstDay_of_Month = new Date(2018, 6, 1).getDay();
firstDay_of_Month
0 // July 1st is on a Sunday.
 
//_________________________________________________________________
 
var d8 = new Date(2018, 7, 1);
d8
"Wed Aug 01 2018" 00:00:00 GMT+0200 (Central European Summer Time)
 
var firstDay_of_Month = new Date(2018, 7, 1).getDay();
firstDay_of_Month
3 // August 1st is on a Wednesday.
 
//_________________________________________________________________
 
var dNaguib = new Date(2018, 6, 7);
dNaguib
"Sat Jul 07 2018" 00:00:00 GMT+0200 (Central European Summer Time)
 
var dNaguib = new Date(2018, 6, 7).getDay();
dNaguib
6 // July 7th is on a Saturday.
 
 
// Why then does this dynamic code looking for the 7th each month
// make everything in the calendar work?
var firstDay_of_Month = new Date(y, m, 7).getDay(); // Naguib


// While the original code looking for the 1st each month make
// some months break the calendar?
var firstDay_of_Month = new Date(y, m, 1).getDay(); // Original

Answer 1

我浏览了您附加的代码笔，并浏览了代码中提到星期日的每个部分，并将其修改为:https://codepen.io/naguibihab/pen/aKMYpB

以下是我所做的更改:https://github.com/naguibihab/js-goodies/commit/aa14d87eea68860650aee3383b458a0b00fb64a9

我将解释为什么我进行每项更改，这让我回到了大学时代，在那里我必须解释我的代码，所以请耐心等待:

1:

  this.DaysOfWeek = [
    'Mon',
    'Tue',
    'Wed',
    'Thu',
    'Fri',
    'Sat',
    'Sun'
  ];

这是日历中标题行的标题，只是文本，没有任何逻辑更改

2:firstDayOfMonth = 6 您这个月的第一天现在是星期一而不是星期日，您也可以写 , firstDayOfMonth = new Date(y, m, 7).getDay()得到相同的结果，但我认为第一个对读者来说更清楚，因为我们总是会得到 6无论如何

3:if ( dow == 1 ) {在星期一而不是星期日开始新行

4:if ( dow == 0 ) {周日而不是周六关闭该行

5:for(dow; dow < 7; dow++) {下个月的“非当前”数字可能会持续到周日，因此我们需要在那里进行额外的迭代(可能有更好的方法可以在不增加迭代的情况下做到这一点，但我现在懒得弄清楚)

这主要是一种“尝试改变某些东西，看看会发生什么”的概念，所以我所做的就是检查我怀疑周日影响代码的每个区域，并尝试更改它以查看会发生什么。

如果这还不够有意义，请在评论中告诉我。