JavaScript: How to Extract the Date from ISO 8601 Complete Date and Time Format (Plus Make It Readable)

The complete format looks like this:

YYYY-MM-DDThh:mm:ss.sTZD

Example:
1997-07-16T19:20:30.45+01:00

www.w3.org/TR/NOTE-datetime

We want to extract everything before the letter "T" ("Time") there, the date pattern. And make the month as strings, e.g. March, May, July, and so forth. Plus, re-format the structure.

This is in JavaScript. For other programming languages, there are built-in features to do it, perhaps.
Like in Python, whoa dude.

---

First, split the string

Let's take the 1997-07-16T19:20:30.45+01:00 as an example input string.

var input = "1997-07-16T19:20:30.45+01:00"; //string. input = input.split("T"); //array. //the "input" variable is now an array: ["1997-07-16", "19:20:30.45+01:00"]

Second, get the first array element and split it again

//the "input" is already an array from above method. //take only the first element. Redefine the "input". input = input[0]; //string: "1997-07-16" input = input.split("-"); //array //the "input" variable is now an array: ["1997", "07", "16"]

Third, define month names, day, month, and year variables

//the "input" is now an array: ["1997", "07", "16"] var monthNames, day, month, year; monthNames = "January,February,March,April,May,June,July,August,September,October,November,December"; //string monthNames = monthNames.split(","); //to array day = input[2]; //the last array element (index: 2) is the day month = input[1]; //the middle is the month year = input[0]; //the year is the first element

Fourth, convert the month number into string

month = monthNames[Number(month) - 1]; //The - 1 (minus one) above is because the array index starts from 0, not 1. //The 1st month from the date pattern has 1 as the month number, not 0. //Thus the "minus one".

The last, let's combine them all into one function block

function extractDate(a) { "use strict"; var input, monthNames, day, month, year; //we can chain the methods for "input" variable: input = a.split("T")[0].split("-"); day = input[2]; month = input[1]; year = input[0]; monthNames = "January,February,March,April,May,June,July,August,September,October,November,December"; monthNames = monthNames.split(","); return monthNames[Number(month) - 1] + " " + day + ", " + year; }

Usage

extractDate("1997-07-16T19:20:30.45+01:00"); //the output will be: "July 16, 1997"

---

This is only for the date

If your thingy there needs to show every single of them, then build another methods/functions to process the time (hour:minute:second.millisecond am/pm) and the time zone (TZD).

For example

See the Pen DateTime ISO-8601 Extractor by Monkey Raptor (@monkeyraptor) on CodePen.

---

Related

A tool to find out the weekday name of a particular date, on Port Raptor