If you want to give it a go, here's the code:
When you call new Date() in your terminal, it defaults to using your browser's time zone and displaying the date as a complete text string, such as Fri Jul 02 2021 12:44:45 GMT+0100 (British Summer Time).
However, including something like this on your web page or application is unprofessional and difficult to understand. As a result, you are forced to explore for better methods to structure these dates.
Let's look at various methods that work with a date object.
There are several methods that may be applied to the date object. These methods can be used to retrieve information from a date object. Here are a few examples:
- getFullYear() returns the current year as a four-digit value (yyyy)
- getMonth() returns the current month as a number (0-11)
- getDate() returns the current date as a number (1-31)
- getHours() returns the current hour (0-23)
- And much more...
Unfortunately, most of these approaches still need a significant amount of code to convert the dates to the desired format.
For instance, new Date ().getMonth() returns the number 6, which represents July. To utilize July in my project, I'll need to write extensive code like this, which can be tedious:
Let's look at two approaches for formatting dates in the best way possible so that you may utilize them for your projects.
- The first three letters in the name of a weekday
- The initial three letters of the month's name
- Two-digit month day, padded on the left by a zero if necessary
- Year (at least four digits), padded on the left with zeros if necessary
One significant disadvantage of this strategy is our inability to modify the date output as we like.
For example, it does not allow us to display dates in our native language. Let's look at another way that, in my opinion, is still one of the greatest.
Let's look at few cases and their results:
You can also choose not to utilize locales or options:
You can also choose to solely utilize locales. Based on my browser's time zone, this will produce the same results as the prior.
You can also choose to change the choices as you see fit. There are four fundamental options:
- weekday — This returns the day of the week in the format you choose (short or long).
- year — This function returns the year as a number.
- month — This returns the month of the year in the format you choose (short or long).
- day – Finally, this produces a number representing the day.
Closing and Buy Me a Coffee
There are about seven formatting options available for the date object. Each of these approaches provides a distinct value:
- Fri Jul 02 2021 14:03:54 GMT+0100 is returned by toString() (British Summer Time)
- Fri Jul 02 2021 is returned by toDateString().
- 7/2/2021, 2:05:07 PM is returned by toLocaleString().
- toLocaleDateString() returns 7/2/2021.
- Fri, 02 Jul 2021 13:06:02 GMT is returned by toGMTString().
- Fri, 02 Jul 2021 13:06:28 GMT is returned by toUTCString().
- toISOString() returns the value 2021-07-02T13:06:53.422Z.
If you want more complicated date formats, you will need to build your own. Check out the resources listed below to learn how to generate unique date formats.
- DateTime Manipulation: The Definitive Guide