Date and time

Objectives

  • Create and modify JavaScript Date objects
  • Format dates and times to suit needs
  • Create Date objects with specific times in the future or past
  • Use a custom date formatting routine: dateformat.js

Date object

  • stores date as milliseconds since 1/1/1970 start of day
  • days before then are stored as negative milliseconds
  • no accuracy guaranteed for days before 1/1/1970
  • constructors
    • Date()
      • uses current date and time
      • returns a string representation of the current date and time if called as a regular function
    • Date(milliseconds)
      • sets new Date object to milliseconds since 1/1/1970 start of day
    • Date(datestring)
      • uses any string handled by Date.parse to set new Date object
    • Date(year, month[, day[, hours[, minutes[, seconds[, milliseconds]]]]])
      • many optional fields: day, hours, minutes, seconds, milliseconds
      • year: 0-99 get 1900 added to them
      • month: 0-11
      • day: 1-31
      • hours: 0-23
      • minutes: 0-59
      • seconds: 0-59
      • milliseconds: 0-999
  • static methods:
    • now(): returns the current time in milliseconds
    • parse(datestring): parses a string representation of a date/time and returns the millisecond representation
    • UTC(year, month, day[, hours[, minutes[, seconds[, milliseconds]]]]): returns the millisecond representation of the specified UTC time
  • methods:
    • getDate(): 1-31
    • getDay(): 0-6
    • getFullYear(): returns four digit year
    • getHours(): 0-23
    • getMilliseconds(): 0-999
    • getMinutes(): 0-59
    • getMonth(): 0-11
    • getSeconds(): 0-59
    • getTime(): returns millisecond representation of date
    • getTimezoneOffset(): returns difference in minutes between local time and UTC time
    • getYear(): (deprecated) use getFullYear() instead
    • setDate(): 0-31
    • setFullYear(): use four digit year value
    • setHours(): 0-23
    • setMilliseconds(): 0-999
    • setMinutes(): 0-59
    • setMonth(): 0-11
    • setSeconds(): 0-59
    • setTime(): sets date/time using milliseconds
    • setYear(): (deprecated) use setFullYear() instead
    • toUTCString(): returns UTC version of date/time
    • toGMTString(): returns GMT version of date/time (deprecated - use toUTCString() instead)
    • toISOString(): returns ISO-8601 version of date/time
    • toJSON(): uses toISOString() to serialize a Date object
    • toLocaleString(): returns local version of date/time
    • toLocaleDateString(): returns local version of date (not time)
    • toLocaleTimeString(): returns local version of time (not date)
    • toString(): returns local version of date/time
    • toDateString(): returns local version of date (not time)
    • toTimeString(): returns local version of time (not date)
    • valueOf(): returns millisecond representation of date/time
  • UTC versions of some of the above methods:
    • getUTCDate()
    • getUTCDay()
    • getUTCFullYear()
    • getUTCHours()
    • getUTCMilliseconds()
    • getUTCMinutes()
    • getUTCMonth()
    • getUTCSeconds()
    • setUTCDate()
    • setUTCFullYear()
    • setUTCHours()
    • setUTCMilliseconds()
    • setUTCMinutes()
    • setUTCMonth()
    • setUTCSeconds()

Examples

Date string formatter example

Note: A nicer version, which is semi-compatible with the Unix/Linux date command is available at dateformat.js. The version used on this page is available at datefmt.js.

  • The following code can be executed to add an easy date formatting funtion to the built-in Date class.
  • The caller passes in a string which is passed right back to the caller, except that certain character sequences are replaced with date information.
  • The date information is based on the values in the date object used to call the method.
  • {$day} is replaced with the full day name: Sunday, Monday, ...
  • {$shortDay} is replaced with the short day name: Sun, Mon, ...
  • {$date} is replaced with the day of the month: 1, 2, 3, ...
  • {$suffix} is replaced with a date suffix: st, nd, rd, th, th, ...
  • {$monthNum} is replaced with the month number: 1, 2, 3, ...
  • {$month} is replaced with the full month name: January, February, ...
  • {$shortMonth} is replaced with the short month name: Jan, Feb, ...
  • {$year} is replaced with the the full four digit year number
  • {$shortYear} is replaced with the last two digits of the year

The JavaScript code

Example run