Convert Date to String in JavaScript (5 Methods)

Convert Date to String in JavaScript

Are you looking for a way to convert date to string in JavaScript? This tutorial will show you 5 different ways to convert a JavaScript date object to a string. Let’s see all the methods one by one.

How to Convert Date to String in JavaScript

1- Use toString() Method

We use the JavaScript toString() method to convert the date object to a string. It’s a built-in JavaScript method that also works with many other JavaScript objects. For the Date object, it returns the string representation of date and time.

It converts and displays the date and time as a string in this format: ‚ÄúDay Month DD YYYY HH:mm:ss GMT+XXXX (Timezone)‚ÄĚ.

The following code example shows how to convert a date object to a string using the toString() method.

<script>
    // first store date object in a variable
    var todayDate = new Date();
    
    // use toString() like this below
    var datestring = todayDate.toString();

    // print output on the screen
    document.write(datestring);
</script>

Code Explanation:

  • First, I created the date object using the¬†new Date()¬†and store it in a variable¬†todayDate.
  • Second, I used the¬†toString()¬†method and stored it in a variable, and name it¬†‚Äėdatestring‚Äô.
  • Then, I print the output on the screen with the help of a¬†document.write()¬†method. However, you can also use¬†console.log()¬†to print the output in your browser‚Äôs console.

The output will look like this below, depending on your browser’s current date and time. However, the date format might be different depending on your browser.

JavaScript toString() Method

Let’s see the second method.

2- Use toDateString() Method

The¬†toDateString()¬†is another JavaScript built-in method that is used to convert string to date in JavaScript. It works the same way as we use the¬†toString()¬†method and the only difference is it returns the date portion excluding time. It outputs a string representing the date in the format ‚ÄúDay Mon DD YYYY‚ÄĚ.

The following JavaScript code shows the syntax to use the toDateString() method.

<script>
    // 1. first store date object in a variable
    var todayDate = new Date();
    
    // 2. use toDateString() like this below
    var datestring = todayDate.toDateString();

    // 3. print output on the screen
    document.write(datestring);
</script>

In the above code, I did a minor change in the second line of code, where I used todayDate.toDateString();.

The output will look like this below, it shows the current date as a string.

Date to String JavaScript

This method is very useful when we need just the date portion and want to exclude time. Now, let’s see the next method.

3- Use toLocaleString() Method

We can use JavaScript toLocaleString() method to convert the date object to a string based on the user’s locale. Mean this method returns the date and time using the system’s locale-specific formatting. Simply its output will look the same as the date and time of your system.

The following code example shows the syntax to use the toLocaleString() method to convert a date object to a string in JavaScript.

<body>

<h1 id="demo"></h1>
    
<!-- JavaScript Code -->
<script>
    // 1. first store date object in a variable
    var todayDate = new Date();
    
    // 2. use toLocaleString() like this below
    var datestring = todayDate.toLocaleString();

    // 3. print output on the screen using getElementById method
    document.getElementById('demo').innerHTML = datestring;
</script>
</body>

Code Explanation:

  • In the above JavaScript code, first I created a date object.
  • Second, I used the¬†toLocaleString()¬†method.
  • Then, I used the¬†JavaScript getElementById() method¬†to print the output on the screen.

In your browser, the result will look like in the following format as shown below.

JavaScript date to toLocaleString()

Moreover, if you want to get the date and time separately, you can use the toLocaleDateString() and toLocaleTimeString() methods.

4- Use toISOString() Method

The toISOString() method converts a date object to a string and displays it in ISO-8601 format that is: YYYY-MM-DDTHH:mm:ss.sssZ. The T in this format is the delimiter between date and time components while Z represents the UTC timezone.

This method is very helpful in many cases like if you want to display a date that should be in machine-readable format instead of human-readable.

The following code examples show the syntax to use this method:

<body>

<h1 id="demo"></h1>
    
<!-- JavaScript Code -->
<script>
    // 1. first store date object in a variable
    var todayDate = new Date();
    
    // 2. use toISOString() like this below
    var datestring = todayDate.toISOString();

    // 3. print output on the screen using getElementById method
    document.getElementById('demo').innerHTML = datestring;
</script>
</body>

In the above code, I did a small modification just look at the second line of code, I just changed todayDate.toISOString();.

The output seems like this below.

Date time in ISO Format

5- Use toUTCString() Method

It‚Äôs another built-in JavaScript method for the date object. By using the¬†toUTCString()¬†method, you can convert a date object to a string according to UTC format. The UTC stands for Universal Coordinated Time is the time set according to World Time Standard. The UTC date and time will look in this format: ‚ÄúDay, DD Mon YYYY HH:mm:ss GMT‚ÄĚ.

The following code syntax shows how to use the toUTCString() method:

<body>

<h1 id="demo"></h1>
    
<!-- JavaScript Code -->
<script>
    // 1. first store date object in a variable
    var todayDate = new Date();
    
    // 2. use toUTCString() like this below
    var datestring = todayDate.toUTCString();

    // 3. print output on the screen using getElementById method
    document.getElementById('demo').innerHTML = datestring;
</script>
</body>

I used the same code as above and did a tiny change in the second line of code where I just replace the method toISOString() with toUTCString(). The output is shown below depending on the current browser.

date to string in UTC format

Last of all, there was also another method in the old versions of JavaScript toGMTString() that has been deprecated so keep in mind to avoid it.

So, that’s all. Now, you know how to convert a date to a string in JavaScript. Hope this tutorial did provide the solution you wanted. If you have questions then leave them in the comment section below.

Related Tutorial:

Don’t forget to share this tutorial to help others!

Leave a Reply

Your email address will not be published. Required fields are marked *