使用 moment.js 在單個數組中獲取日歷月中出現的所有 42 天

Question

我正在使用 JavaScript 和 Moment.js 創建一個日歷，並想知道如何創建一個數組，其中包含應為所選月份顯示的所有 42 天（日期）。

我正在使用 moment getDaysInMonth() 函數來幫助我獲取當前選定月份中的天數，然后循環遍歷它們將所有日期推送到一個數組中。

我正在努力填寫上個月的最后幾天和下個月的前幾天（您通常會在日歷中看到它們變灰）。

這是顯示數組中第 1 周和第 6 周的示例。 點顯示可以假設的其余日期：

[new Date("2020-07-26"), new Date("2020-07-27"), new Date("2020-07-28"), new Date("2020-07-29"), new Date("2020-07-30"), new Date("2020-07-31"), new Date("2020-07-01"),................................................... new Date("2020-08-30"), new Date("2020-08-31"), new Date("2020-09-01"), new Date("2020-09-02"), new Date("2020-09-03"), new Date("2020-09-04"), new Date("2020-09-05")],

Answer 1

你可以考慮這個解決方案（很長但有效）

• 獲取當月的日期：遍歷該月的日期

  iteratedDate = startOfMonth.clone() while (iteratedDate.month() === month - 1) { currentMonth.push(iteratedDate.format("L")) iteratedDate.add(1, "day") }

• 獲取上個月最后一天的日期：以當前月份的開始開始循環，推送日期並在迭代日期為星期日時停止

  iteratedDate = startOfMonth.clone() while (iteratedDate.day() !== 0) { iteratedDate.subtract(1, "day") finalsOfPrevMonth.push(iteratedDate.format("L")) }

• 獲取下個月開始的日期：以當月結束開始循環，推送遞增的日期，直到總日期達到 42 的長度

  iteratedDate = endOfMonth.clone() while (finalsOfPrevMonth.length + currentMonth.length + startsOfNextMonth.length < 42) { iteratedDate.add(1, "day") startsOfNextMonth.push(iteratedDate.format("L")) }

---

執行

 const getDates = (month, year) => { const startOfMonth = moment() .month(month - 1) .year(year) .startOf("month") const endOfMonth = moment() .month(month - 1) .year(year) .endOf("month") const finalsOfPrevMonth = [] const currentMonth = [] const startsOfNextMonth = [] let iteratedDate = null iteratedDate = startOfMonth.clone() while (iteratedDate.day() !== 0) { iteratedDate.subtract(1, "day") finalsOfPrevMonth.push(iteratedDate.format("L")) } iteratedDate = startOfMonth.clone() while (iteratedDate.month() === month - 1) { currentMonth.push(iteratedDate.format("L")) iteratedDate.add(1, "day") } iteratedDate = endOfMonth.clone() while (finalsOfPrevMonth.length + currentMonth.length + startsOfNextMonth.length < 42) { iteratedDate.add(1, "day") startsOfNextMonth.push(iteratedDate.format("L")) } return [...finalsOfPrevMonth.reverse(), ...currentMonth, ...startsOfNextMonth] } console.log("March 2020") console.log(getDates(3, 2020)) console.log("April 2020") console.log(getDates(4, 2020)) console.log("May 2020") console.log(getDates(5, 2020))

 <script src="https://momentjs.com/downloads/moment.min.js"></script>

---

斷言

Answer 2

Moment 具有獲取特定時間段（包括月和周）開始和結束的功能。 您可以使用這些來獲取本月的開始，以及本月的開始所在的一周的開始。然后對結束執行相同的操作。 然后在它們之間迭代幾天，隨時添加。

 function getDaysForCalendarMonth(date) { var firstDayOfMonth = moment(date).startOf('month'); var firstDayOfCal = firstDayOfMonth.clone().startOf('week'); var lastDayOfMonth = firstDayOfMonth.clone().endOf('month'); var lastDayOfCal = lastDayOfMonth.clone().endOf('week'); var temp = firstDayOfCal.clone(); var days = [temp.toDate()]; while (temp.isBefore(lastDayOfCal) && days.length < 42) { temp.add(1, 'day'); days.push(temp.toDate()); } while (days.length < 42) { temp.add(1, 'day'); days.push(temp.toDate()); } return days; } console.log(getDaysForCalendarMonth(new Date(2020, 2, 1))); console.log(getDaysForCalendarMonth(new Date(2020, 3, 1))); console.log(getDaysForCalendarMonth(new Date()));

 .as-console-wrapper { max-height: 100% !important; }

 <script src="https://momentjs.com/downloads/moment.min.js"></script>