Convert Date To String in TypeScript

Introduction

The Date object is the key to date and time functionality in TypeScript. If we create it with no argument passed to its constructor, it will contain the current date and time of the user's computer. The Date object also provides a number of functions dealing with something called Coordinated Universal Time (UTC) time, also known (in the Winter) as Greenwich Mean Time (GMT).

In this article I am describing the date object's "toDateString" method in the TypeScript.

toDateString() Method

In TypeScript, the toDateString() method converts the date of a Date object into a readable string, but it does not convert the time.

Syntax

Date.toDateString()

Function

    convertdate()

    {

        var date = new Date();

        var span = document.createElement("span");

        span.innerText = "Current Time is -> " + date + "\n";

        document.body.appendChild(span);

       

        var span = document.createElement("span");

        span.style.color = "#00CC99";

        span.innerText = "After change Date -> " + date.toDateString() + "\n";

        document.body.appendChild(span);

    }

 

Complete Program

Convert_Date.ts

class ConvertDate

{

    convertdate()

    {

        var date = new Date();

        var span = document.createElement("span");

        span.innerText = "Current Time is -> " + date + "\n";

        document.body.appendChild(span);

       

        var span = document.createElement("span");

        span.style.color = "#00CC99";

        span.innerText = "After change Date -> " + date.toDateString() + "\n";

        document.body.appendChild(span);

    }

}

window.onload = () =>

{

    var obj = new ConvertDate();

    var bttn = <HTMLButtonElement>(document.getElementById("Button1"));

    bttn.onclick = function () {

        obj.convertdate();

    }

};

 

Convert_Date_to_String_Demo.htm

<!DOCTYPE html>

 

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">

<head>

    <meta charset="utf-8" />

    <title>TypeScript HTML App</title>

    <link rel="stylesheet" href="app.css" type="text/css" />

    <script src="Convert_Date.js"></script>

</head>

<body>

    <h3>toDateString() method in TypeScript</h3>

    <div id="content" style="font-weight: normal; font-size: small">Click the button to display a date as a string<br />

        <br />

        <input id="Button1" type="button" value="Change Date to String" /></div>

</body>

</html>

 

Convert_Date.js

var ConvertDate = (function () {

    function ConvertDate() { }

    ConvertDate.prototype.convertdate = function () {

        var date = new Date();

        var span = document.createElement("span");

        span.innerText = "Current Time is -> " + date + "\n";

        document.body.appendChild(span);

        var span = document.createElement("span");

        span.style.color = "#00CC99";

        span.innerText = "After change Date -> " + date.toDateString() + "\n";

        document.body.appendChild(span);

    };

    return ConvertDate;

})();

window.onload = function () {

    var obj = new ConvertDate();

    var bttn = (document.getElementById("Button1"));

    bttn.onclick = function () {

        obj.convertdate();

    };

};

//@ sourceMappingURL=Convert_Date.js.map

 

Output

 

For more information, download the attached sample application.