Krok 3: dzień jako obiekt z informacjami

Kalendarz: logika oddzielona od widoku - Kalendarz w JavaScript krok po kroku (JavaScript)

Widok nie powinien sam liczyć, czy dzień to weekend albo dzisiaj. Model oddaje więc zamiast liczby obiekt `{ day, weekend, today }`, a widok tylko z niego czyta: dzisiaj dostaje gwiazdkę. Porównanie dat wydzielone do `sameDay`.

const sameDay = (a, b) =>
  a.getFullYear() === b.getFullYear() && a.getMonth() === b.getMonth() && a.getDate() === b.getDate();

// model: miesiąc jako tablica tygodni, dzień = obiekt z informacjami, puste pole = null
function monthWeeks(year, month, today) {
  const firstDay = (new Date(year, month - 1, 1).getDay() + 6) % 7;
  const days = new Date(year, month, 0).getDate();
  const cells = Array(firstDay).fill(null);
  for (let d = 1; d <= days; d++) {
    cells.push({
      day: d,
      weekend: (firstDay + d - 1) % 7 >= 5,
      today: sameDay(new Date(year, month - 1, d), today),
    });
  }
  while (cells.length % 7 !== 0) cells.push(null);
  const weeks = [];
  for (let i = 0; i < cells.length; i += 7) weeks.push(cells.slice(i, i + 7));
  return weeks;
}
// widok: tygodnie zamienione na wiersze tekstu, dzisiaj z gwiazdką
function textView(weeks) {
  const lines = ['Pn Wt Śr Cz Pt So Nd'];
  for (const week of weeks) {
    lines.push(week.map(c => (c === null ? '   ' : String(c.day).padStart(2) + (c.today ? '*' : ' '))).join(''));
  }
  return lines.join('\n');
}
const today = new Date(2026, 10, 13); // w prawdziwym programie: new Date()
console.log(textView(monthWeeks(2026, 11, today)));

Ładowanie interaktywnego edytora... Jeśli się nie pojawi, włącz JavaScript.

Wszystkie lekcje kursu Kalendarz w JavaScript krok po kroku·Zaloguj się, aby zapisać postęp na koncie.