JavaScript Date Object — JavaScript Tutorial

Working with Dates and Times

The Date object lets you work with dates and times in JavaScript.

You can create, format, and manipulate dates easily.

Example

// Creating Dates
const now = new Date();  // Current date/time
const specific = new Date('2024-12-25');  // Specific date
const fromValues = new Date(2024, 11, 25);  // Year, month (0-11), day

// Getting Components
now.getFullYear();   // 2024
now.getMonth();      // 0-11 (0 = January)
now.getDate();       // 1-31 (day of month)
now.getDay();        // 0-6 (0 = Sunday)
now.getHours();      // 0-23
now.getMinutes();    // 0-59
now.getSeconds();    // 0-59

// Setting Components
now.setFullYear(2025);
now.setMonth(5);  // June (0-based)
now.setDate(15);

// Formatting
now.toString();           // Full string
now.toDateString();       // Date only
now.toTimeString();       // Time only
now.toLocaleDateString(); // Locale date

// Timestamps
Date.now();          // Current timestamp
now.getTime();       // Date as timestamp

// Date arithmetic
const tomorrow = new Date();
tomorrow.setDate(tomorrow.getDate() + 1);

new Date() - Create date object
getFullYear/Month/Date - Get components
setFullYear/Month/Date - Set components
toDateString() - Format as string
Date.now() - Current timestamp
getTime() - Convert to timestamp
Month is 0-indexed (0=Jan, 11=Dec)

Try Date Object

HTML

<div class="date-demo">
  <h3>Date & Time Tools</h3>
  <button onclick="showCurrentTime()">🕐 Current Time</button>
  <button onclick="calculateAge()">🎂 Calculate Age</button>
  <button onclick="countdown()">⏰ Days Until New Year</button>
  <div id="dateOutput"></div>
</div>

CSS

.date-demo { padding: 20px; background: #f0f0f0; border-radius: 8px; }
button { padding: 10px 15px; background: #d1039e; color: white; border: none; border-radius: 5px; cursor: pointer; margin: 5px; }
#dateOutput { margin-top: 15px; padding: 15px; background: white; border-radius: 5px; min-height: 40px; font-size: 16px; }

JavaScript

function showCurrentTime() {
  const now = new Date();
  const days = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'];
  const months = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'];
  
  const dayName = days[now.getDay()];
  const monthName = months[now.getMonth()];
  const date = now.getDate();
  const year = now.getFullYear();
  const hours = String(now.getHours()).padStart(2, '0');
  const minutes = String(now.getMinutes()).padStart(2, '0');
  const seconds = String(now.getSeconds()).padStart(2, '0');
  
  document.getElementById('dateOutput').innerHTML = `
    <strong>Current Date & Time:</strong><br><br>
    ${dayName}, ${monthName} ${date}, ${year}<br>
    ${hours}:${minutes}:${seconds}
  `;
}

function calculateAge() {
  const birthYear = prompt('Enter your birth year:', '2000');
  if (birthYear) {
    const age = new Date().getFullYear() - parseInt(birthYear);
    const nextBirthday = new Date(new Date().getFullYear() + 1, 0, 1);
    const daysUntil = Math.ceil((nextBirthday - new Date()) / (1000 * 60 * 60 * 24));
    
    document.getElementById('dateOutput').innerHTML = `
      <strong>Age Calculator:</strong><br>
      Birth Year: ${birthYear}<br>
      Current Age: ${age} years old<br>
      Days until next birthday year: ${daysUntil}
    `;
  }
}

function countdown() {
  const now = new Date();
  const newYear = new Date(now.getFullYear() + 1, 0, 1);
  const diff = newYear - now;
  
  const days = Math.floor(diff / (1000 * 60 * 60 * 24));
  const hours = Math.floor((diff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
  const minutes = Math.floor((diff % (1000 * 60 * 60)) / (1000 * 60));
  
  document.getElementById('dateOutput').innerHTML = `
    <strong>Countdown to New Year ${newYear.getFullYear()}:</strong><br><br>
    <div style="font-size: 24px; font-weight: bold; color: #d1039e;">
      ${days} days, ${hours} hours, ${minutes} minutes
    </div>
  `;
}

Notes

Remember: Months are 0-indexed! January = 0, December = 11.