JavaScript Dates and Intl Formatting
The Date object stores a moment in time. The Intl tools turn dates and numbers into text that looks right for each country.
Creating a Date
| Code | Creates |
|---|---|
new Date() | Right now |
new Date("2026-08-14") | A date from an ISO text (year-month-day) |
new Date(2026, 7, 14) | Year, month, day. Months start at 0, so 7 is August |
new Date(2026, 7, 14, 9, 30) | Also hours and minutes |
Date.now() | Not a Date: the current time as a number of milliseconds |
Example
<!DOCTYPE html>
<html>
<body>
<p id="demo"></p>
<script>
const now = new Date();
const independence = new Date(2026, 7, 14);
document.getElementById("demo").innerHTML =
"Now: " + now.toString() + "<br>" +
"Independence Day: " + independence.toDateString();
</script>
</body>
</html>The month number trap catches everyone: January is 0 and December is 11. Days of the month, however, start at 1.
Reading Parts of a Date
| Method | Returns |
|---|---|
getFullYear() | Year, like 2026 |
getMonth() | Month, 0 to 11 |
getDate() | Day of the month, 1 to 31 |
getDay() | Day of the week, 0 (Sunday) to 6 (Saturday) |
getHours(), getMinutes() | The time |
getTime() | Milliseconds since 1 January 1970 |
Each get method has a set partner, like setDate() or setFullYear().
Example
const d = new Date(2026, 9, 15); // 15 October 2026
console.log(d.getFullYear(), d.getMonth() + 1, d.getDate(), d.getDay());2026 10 15 4
getDay() gives 4, which is Thursday.
Date Maths
Subtracting two dates gives the difference in milliseconds. Divide to get days:
Example
<!DOCTYPE html>
<html>
<body>
<h3>Course Countdown</h3>
<p id="demo"></p>
<script>
const today = new Date();
const start = new Date(today.getFullYear() + 1, 0, 5); // 5 January next year
const msPerDay = 1000 * 60 * 60 * 24;
const daysLeft = Math.ceil((start - today) / msPerDay);
document.getElementById("demo").textContent =
"The new batch starts in " + daysLeft + " days.";
</script>
</body>
</html>To add days, change the day number. JavaScript fixes the month for you:
Example
const due = new Date(2026, 9, 25);
due.setDate(due.getDate() + 10); // 10 days later
console.log(due.toDateString());Wed Nov 04 2026
Formatting With toLocaleDateString
Dates look different in each country. toLocaleDateString(locale, options) handles this:
Example
const d = new Date(2026, 2, 23); // 23 March 2026
console.log(d.toLocaleDateString("en-GB")); // 23/03/2026
console.log(d.toLocaleDateString("en-US")); // 3/23/2026
console.log(d.toLocaleDateString("en-PK", { dateStyle: "full" }));
console.log(d.toLocaleDateString("ur-PK", { weekday: "long", day: "numeric", month: "long" }));The last two lines show the full date in English and Urdu. A locale is a language code plus a country code, like en-PK (English, Pakistan) or ur-PK (Urdu, Pakistan).
Common options:
| Option | Values |
|---|---|
dateStyle | "full", "long", "medium", "short" |
weekday | "long" (Monday) or "short" (Mon) |
month | "long", "short", "numeric", "2-digit" |
hour, minute | "numeric" or "2-digit" |
timeZone | e.g. "Asia/Karachi", "Europe/London" |
Formatting Money and Numbers
Intl.NumberFormat formats numbers, prices and percentages:
Example
<!DOCTYPE html>
<html>
<body>
<p id="demo"></p>
<script>
const rupees = new Intl.NumberFormat("en-PK", { style: "currency", currency: "PKR", maximumFractionDigits: 0 });
const dollars = new Intl.NumberFormat("en-US", { style: "currency", currency: "USD" });
const percent = new Intl.NumberFormat("en", { style: "percent" });
const compact = new Intl.NumberFormat("en", { notation: "compact" });
document.getElementById("demo").innerHTML =
"Laptop: " + rupees.format(185000) + "<br>" +
"Freelance job: " + dollars.format(1250.5) + "<br>" +
"Pass rate: " + percent.format(0.87) + "<br>" +
"Followers: " + compact.format(1530000);
</script>
</body>
</html>Laptop: Rs 185,000 Freelance job: $1,250.50 Pass rate: 87% Followers: 1.5M
The exact currency sign can differ slightly between browsers, but the format always matches the locale.
Relative Time
Intl.RelativeTimeFormat writes friendly phrases like "in 3 days" or "yesterday":
Example
const rtf = new Intl.RelativeTimeFormat("en", { numeric: "auto" });
console.log(rtf.format(-1, "day")); // yesterday
console.log(rtf.format(3, "day")); // in 3 days
console.log(rtf.format(-2, "hour")); // 2 hours agoAlways store and send dates in ISO format with date.toISOString() (for example "2026-10-15T07:30:00.000Z"). Only format them for people at the last moment, when you show them on the page.
Exercise
Exercise
What does new Date(2026, 0, 1).getMonth() return?