HiveBrain v1.2.0
Get Started
← Back to all entries
snippetjavascriptTip

Format a date to ISO string with timezone using JavaScript

Submitted by: @import:30-seconds-of-code··
0
Viewed 0 times
timezonejavascriptdatewithformatusingisostring

Problem

The ISO 8601 standard defines a format for dates and times. It is widely adopted across the world and has applications in all fields, from business to science.
Dates in the format are represented either as:
  • YYYY-MM-DDTHH:mm:ss.sssZ (UTC time)
  • YYYY-MM-DDTHH:mm:ss.sss±hh:mm (local time with timezone offset)


Let's see how we can convert a date to either format using JavaScript.

Solution

const toISOString = date => date.toISOString();

toISOString(
  new Date('2024-01-06T19:20:34+02:00')
); // '2024-01-06T17:20:34.000Z'


  • YYYY-MM-DDTHH:mm:ss.sssZ (UTC time)
  • YYYY-MM-DDTHH:mm:ss.sss±hh:mm (local time with timezone offset)


Let's see how we can convert a date to either format using JavaScript.
JavaScript's built-in Date.prototype.toISOString() method converts a date to ISO string in UTC time.
In order to include the timezone offset, you have to build the string yourself.
For this, you'll need to know the timezone offset of the date, which can be retrieved using Date.prototype.getTimezoneOffset(). The returned values is in minutes, so you'll have to convert it to hours and minutes. It also returns a negative value for positive offsets, so you'll have to reverse the sign.

Code Snippets

const toISOString = date => date.toISOString();

toISOString(
  new Date('2024-01-06T19:20:34+02:00')
); // '2024-01-06T17:20:34.000Z'
// Pad a number to 2 digits
const pad = n => `${Math.floor(Math.abs(n))}`.padStart(2, '0');
// Get timezone offset in ISO format (+hh:mm or -hh:mm)
const getTimezoneOffset = date => {
  const tzOffset = -date.getTimezoneOffset();
  const diff = tzOffset >= 0 ? '+' : '-';
  return diff + pad(tzOffset / 60) + ':' + pad(tzOffset % 60);
};

const toISOStringWithTimezone = date => {
  return date.getFullYear() +
    '-' + pad(date.getMonth() + 1) +
    '-' + pad(date.getDate()) +
    'T' + pad(date.getHours()) +
    ':' + pad(date.getMinutes()) +
    ':' + pad(date.getSeconds()) +
    getTimezoneOffset(date);
};

toISOStringWithTimezone(
  new Date('2024-01-06T19:20:34+02:00')
); // '2024-01-06T19:20:34+02:00'
const isISOString = val => {
  const d = new Date(val);
  return !Number.isNaN(d.valueOf()) && d.toISOString() === val;
};

const isISOStringWithTimezone = val => {
  const d = new Date(val);
  return !Number.isNaN(d.valueOf()) && toISOStringWithTimezone(d) === val;
};

isISOString('2020-10-12T10:10:10.000Z'); // true
isISOString('2020-10-12'); // false
isISOStringWithTimezone('2020-10-12T10:10:10+02:00'); // true
isISOStringWithTimezone('2020-10-12T10:10:10.000Z'); // false

Context

From 30-seconds-of-code: iso-format-date-with-timezone

Revisions (0)

No revisions yet.