Post
Ask Question

Date Object Method In TypeScript: Part 10

Date Object Method In TypeScript: Part 10 

 
Before reading this article, please go through the following articles:

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 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), also known as Greenwich Mean Time (GMT) during winter. The World Time Standard is set by the UTC time.
 
In this article, I am describing the date object's "setHours" method in the TypeScript.
 

setHours() Method

 
In TypeScript, the setHours() method of the data object sets the hour of the local time. We can also set the minutes, seconds and milliseconds by this method.
 
Syntax
  1. Date.setHours(hour,min,sec,millisec)   
  • Hour It is the required parameter. Hours are represented by an integer value between 0 and 23. And -1 will result in the last hour of the previous day. And 24 will result in the first hours of the next day.
  • Min It is an optional parameter. Minutes are represented by an integer value from 0 to 59.
  • Sec It is an optional parameter. Seconds are represented by an integer value from 0 to 59.
  • Millisec It is an optional parameter. Milliseconds are represented by an integer value from 0 to 999.
Function
  1. sethours() {  
  2.  var hours = new Date();  
  3.  var span = document.createElement("span");  
  4.  span.innerText = "Current Time is -> " + hours + "\n";  
  5.  document.body.appendChild(span);  
  6.  hours.setHours(2);  
  7.  var span = document.createElement("span");  
  8.  span.style.color = "Blue";  
  9.  span.innerText = "After change hours, Time is -> " + hours + "\n";  
  10.  document.body.appendChild(span);  
  11. }  

Complete Program

 
setHours.ts
  1. class SetHours  
  2. {  
  3.  sethours()  
  4.  {  
  5.   var hours = new Date();  
  6.   var span = document.createElement("span");  
  7.   span.innerText = "Current Time is -> " + hours + "\n";  
  8.   document.body.appendChild(span);  
  9.   hours.setHours(2);  
  10.   var span = document.createElement("span");  
  11.   span.style.color = "Blue";  
  12.   span.innerText = "After change hours, Time is -> " + hours + "\n";  
  13.   document.body.appendChild(span);  
  14.  }  
  15. }  
  16. window.onload = () =>  
  17.  {  
  18.   var obj = new SetHours();  
  19.   var bttn = < HTMLButtonElement > (document.getElementById("Button1"));  
  20.   bttn.onclick = function()  
  21.   {  
  22.    obj.sethours();  
  23.   }  
  24.  };  
setHours_MethodDemo.htm
  1. <!DOCTYPE html>  
  2. <html lang="en"  
  3.     xmlns="http://www.w3.org/1999/xhtml">  
  4.     <head>  
  5.         <meta charset="utf-8" />  
  6.         <title>TypeScript HTML App</title>  
  7.         <link rel="stylesheet" href="app.css" type="text/css" />  
  8.         <script src="SetHours.js"></script>  
  9.     </head>  
  10.     <body>  
  11.         <h3>setHours method in TypeScript</h3>  
  12.         <div id="content" style="font-weight: normal; font-size: small">Click the button to display a date after changing the hours  
  13.             <br />  
  14.             <br />  
  15.             <input id="Button1" type="button" value="Change Hours" />  
  16.         </div>  
  17.     </body>  
  18. </html>  
setHours.js
  1. var SetHours = (function() {  
  2.  function SetHours() {}  
  3.  SetHours.prototype.sethours = function() {  
  4.   var hours = new Date();  
  5.   var span = document.createElement("span");  
  6.   span.innerText = "Current Time is -> " + hours + "\n";  
  7.   document.body.appendChild(span);  
  8.   hours.setHours(2);  
  9.   var span = document.createElement("span");  
  10.   span.style.color = "Blue";  
  11.   span.innerText = "After change hours, Time is -> " + hours + "\n";  
  12.   document.body.appendChild(span);  
  13.  };  
  14.  return SetHours;  
  15. })();  
  16. window.onload = function() {  
  17.  var obj = new SetHours();  
  18.  var bttn = (document.getElementById("Button1"));  
  19.  bttn.onclick = function() {  
  20.   obj.sethours();  
  21.  };  
  22. };  
Output
 
 Result.jpg
 
For more information, download the attached sample application.


Similar Articles