How To Format Dates In JavaScript
Tags: javascript, webdev, beginners, tutorial
Published: 2021-10-12 19:29:54

If you are a developer who uses JavaScript, you’re going to have to format dates often. Date formatting may seem complex and overwhelming for beginners, but it is pretty simple as you will agree after reading through this article.
JavaScript’s `Date()` function object can easily be used to display date, time, even specific to time zones.

```js
let date = new Date();
console.log(date);
```

The code above is probably the easiest, most common way the date function is used, and since I didn’t assign another function to it, the date and time will be printed in a localized format.
There are other simple date formatting methods available in JavaScript, one of which is the `toLocaleDateString` method.

###The toLocaleDateString Method

This method lets you customize your date with a specific location of your choice and exactly the way you want it to appear. It allows you to add a locale(a language code) and an option, takes both as arguments, and gives you the time and date in your specified locale and format.
You can use the `toLocaleDateString` method without a locale and option. You can also use it without an option or with both a locale and an option present. The syntax for each is listed below.

```js
toLocaleDateString()
toLocaleDateString(locales)
toLocaleDateString(locales, options)
```

When using locales, you need to remember the language code you want to use. For the USA, we have `en-US`; for the United Kingdom, we have `en-UK`, and it goes on like that. You can find the appropriate language code by searching it up.
Using locales only, we would have the syntax in this format:

```js
new Date().toLocaleDateString(‘en-US’)
new Date().toLocaleDateString(‘en-UK’)
new Date().toLocaleDateString(‘zh-CN’)
```

However, using locales with options gives us more room to customize so the syntax is usually like this

```js
const options = { weekday: ‘short’, year: ‘numeric’, month: ‘long’, day: ‘numeric’ };
const today = new Date();
console.log(today.toLocaleDateString(“en-UK”, options));
```
My preferred way of writing the same syntax is
```js
console.log(date.toLocaleString(‘en-UK’, {
weekday: ‘short’,
day: ‘numeric’,
year: ‘numeric’,
month: ‘long’,
}));
```
Both ways get the job done and allow you to customize as you want to. While weekday, day, month, year are the basic options commonly used, you can also add `hour`, `minute`, and `second` options if you also want to customize your time.

The `weekday` option specifies how you want your weekday to appear. You can have it abbreviated(short) or in full(long).

The `month` option specifies how you want your month to appear. You can have it abbreviated(short) or in full(long).

The `year`, `day`, `hour`, `minute`, and `second` options are usually numeric, meaning they appear as numbers.

There are other ways to format dates, one of which is the `Intl.DateTimeFormat` This method is similar to the `toLocaleDateString` and I will be covering it in my next article.

_I hope you found this useful. I would like to hear from you so feel free to drop a comment or connect with me via [Twitter](https://twitter.com/tire_nii), [LinkedIn](https://www.linkedin.com/in/oyinawosan/), or you can check out my [Github](https://github.com/OyinOlamide) page for some cool projects._