Quiz: 14 JavaScript Date Questions
Learn to impress at parties with JS trivia! ✨
How well do you know the Date
class?
- Prove your JavaScript skillz! 🚀
- No login or signup required. ✨
- Multiple choice. 🤖 … How difficult can it be, eh?
Outline
The Date
class in JavaScript has a notoriously difficult API. It was inherited from Java, and I can only assume was inspired ancient neolithic time keeping methods.
The struggle to get Date
’s leads many developers to use 3rd party libraries without question. While often a safe and reliable choice, these libraries are rarely needed for formatting dates or localization!
This quiz is designed to test (and deepen) your knowledge of the native Date
API. Use the green buttons for hints & explanations! Hopefully by the end of the challenge you’ll have solidified your understanding of Date
’s in JavaScript.
NOTE: Assume all examples assume GMT-7 local timezone.
👇 14 Questions Below 👇
Handling Dates
What will the output include?
The Month argument is zero-based. With a range of 0-11 (using western calendars.)
‘February’ has an index value of one. (Think of it like an array lookup.)
Handling Dates
What will the output include?
The Month argument is zero-based. With a range of 0-11 (using western calendars.)
‘January’ has an index value of zero. (Think of it like an array lookup.)
Handling Dates
What will the output include?
Don’t forget the new
keyword! Date
is a class, and should be called with new
.
Date('...')
without new
ignores what you give it. It appears to always produce the current date & time with new Date()
(no arguments).
This is a common gotcha that’s easy to overlook, even in code review.
Handling Dates
What will the output include?
A Date instance created with a single integer argument is interpreted as a Unix Epoch
value. Epoch
is a count of milliseconds since Jan 1st, 1970.
A value of 2020
(milliseconds) translates to 2 seconds after Jan 1st, 1970.
Then since our local time zone is a negative offset of -7 hours, we end up with Wed Dec 31 1969 17:00:02 GMT-0700 (Mountain Standard Time)
.
You can side-step the local timezone offset by using .getUTCFullYear()
.
Handling Dates
What value will print to the console?
The string without a T
time value may appear to be Jan 1st, 2020 - but it’s interpreted as a GMT time, and when adjusted to our local timezone (GMT-7) we find we’re still in 2019.
The Date
class implicitly applies local time to date strings when a time is not provided.
The T00:00
causes it to adjust for local time.
The first date is interpreted as Tue Dec 31 2019 17:00:00 GMT-0700 (Mountain Standard Time)
.
The second date is interpreted as Wed Jan 01 2020 00:00:00 GMT-0700 (Mountain Standard Time)
.
Handling Dates
Select an incorrect formatting method:
The method toLocaleFormat()
isn’t standard! It may look familiar since it’s from an ancient 3rd party library.
Check out the toLocaleDateString
docs method. It’s behavior is documented under Intl.DateTimeFormat
.
Handling Dates
What will the output include?
You’ll get TypeError: date.toUTCString is not a function
, since Date.UTC()
returns an integer in milliseconds, not a date instance.
Handling Dates
What will the output include?
Date’s will be implicitly presented in local time, with an (effectively) unchanging .getTimezoneOffset()
.
Date
instances do not store timezone data. They store the # of milliseconds since the Unix Epoch (Jan 1, 1970). The timezone is accounted for when Date String parsing & rendering. The default display behavior is automatically determined based on the system or browser’s locale settings.
Handling Dates
What will the output include?
The .setDate()
method sets the day of the month, based on the given instance’s current month.
If a value is provided outside of the number of days available, the date instance month value will be adjusted (e.g. A setDate(32)
in January will calculate as February 1st.)
Handling Dates
What will the output include?
The .setMonth()
method sets the month of the given date instance.
The month argument is zero-based, with a range of 0-11 (using western calendars.)
Handling Dates
What will the output include?
The .setMonth()
method sets the month of the given date instance.
The month
argument is zero-based, with 12 values in the range of 0-11 (using western calendars.)
Here we see the year is adjusted to 2021, because setMonth(12)
is 1 more than 11 (December).
Handling Dates
What will the output include?
The .setMonth()
method sets the month of the given date instance.
The month argument is zero-based, with a range of 0-11 (using western calendars.)
Here we see the month and year is adjusted to February 2021, because setMonth(13)
is 2 more than 11 (December).
Handling Dates
What will the output include?
The .setMonth()
method sets the month of the given date instance.
The month argument is zero-based, with a range of 0-11 (using western calendars.)
Here we see the month and year rolls back to December 2019, because setMonth(-1)
is less than 0 (January).