Javascript date is invalid on iOS

Question

I'm working on a Phonegap-based iOS app, which is already done for Android. The following lines are working fine for Android but not for iOS. Why?

var d = new Date("2015-12-31 00:00:00");
console.log(d.getDate() + '. ' + d.getMonth() + ' ' + d.getFullYear();

Result for Android:

31.11 2015

Result on iOS:

NaN. NaN NaN

Where is the difference coming from?

Answer 1

Your date string is not in a format specified to work with new Date. The only formats in the spec are a simplified version of ISO-8601 (added in ES5 in 2009 and updated in ES2015 and ES2016), and the format output by Date.prototype.toString. Your string isn't in either format, but it's really close to the ISO-8601-like format. It would also be easy to change it to a format that isn't in the spec, but is universally supported

Four options for you:

• Use the upcoming Temporal feature (it's now at Stage 3)
• The specified format
• An unspecified format that's near-universally supported
• Parse it yourself

Use the upcoming Temporal feature

The Temporal proposal is at Stage 3 as of this update in August 2021. You can use it to parse your string, either treating it as UTC or as local time:

Treating the string as UTC:

// (Getting the polyfill)
const {Temporal} = temporal;

const dateString = "2015-12-31 00:00:00";
const instant = Temporal.Instant.from(dateString.replace(" ", "T") + "Z");
// Either use the Temporal.Instant directly:
console.log(instant.toLocaleString());
// ...or get a Date object:
const dt = new Date(instant.epochMilliseconds);
console.log(dt.toString());

<script src="https://unpkg.com/@js-temporal/polyfill/dist/index.umd.js"></script>

Or treating it as local time:

// (Getting the polyfill)
const {Temporal} = temporal;

const dateString = "2015-12-31 00:00:00";

console.log("Parsing as local time:");
const tz = Temporal.Now.timeZone();
const instant = tz.getInstantFor(dateString.replace(" ", "T"));
console.log(instant.toLocaleString());
const dt = new Date(instant.epochMilliseconds);
console.log(dt.toString());

<script src="https://unpkg.com/@js-temporal/polyfill/dist/index.umd.js"></script>

Temporal doesn't have the problem mentioned below that the specified date/time string format historically had when no timezone was specified.

The ISO-8601-like format

If you change the space to a T, you'll be in spec:

var dateString = "2015-12-31 00:00:00";
// Treats the string as local time -- BUT READ BELOW, this varied
var d = new Date(dateString.replace(" ", "T"));
console.log(d.toString());

(I'm assuming you're not actually using a string literal, hence the replace call.)

For reliable timezone handling in old browsers, you'll also want to append a Z (for GMT/UTC) or a timezone indicator (+/- HH:MM), because the handling of strings without them was mis-specified in ES5, updated in ES2015, and then updated further in ES2016. Current versions of modern browsers follow the spec now, which says:

• If there's a time on the string but and no timezone indicator, parse the string in local time
• If there's no time on the string and no timezone indicator, parse the string in UTC

(ES5 said always default to UTC. ES2015 said always default to local time. ES2016 is where the current behavior was defined. It's been stable since.)

So it's best to include a timezone indicator, especially if you have to support older browsers. Note that it must be a Z (UTC) or +/- HH:MM; abbreviations like CST are not allowed, as there's no standard for them. Here's a UTC example:

var dateString = "2015-12-31 00:00:00";
// Treat the string as UTC
var d = new Date(dateString.replace(" ", "T") + "Z");
console.log(d.toString());

An unspecified format that's near-universally supported

There's a seconnd format that isn't in the specification but is near-universally supported and has been for a long time: YYYY/MM/DD HH:MM:SS, which is interpreted as local time. So:

var dateString = "2015-12-31 00:00:00";
// Treats the string as local time
var d = new Date(dateString.replace(/-/g, "/"));
console.log(d.toString());

Again, though, that's unspecified behavior, so caveat emptor. But it works in at least IE8+ (probably earlier), Chrome and anything else using the V8 JavaScript engine, Firefox, and Safari.

Parse it yourself

It's also easy to parse that string yourself. Using ES2020+ features:

function parseDate(str) {
    const [dateparts, timeparts] = str.split(" ");
    const [year, month, day] = dateparts.split("-");
    const [hours = 0, minutes = 0, seconds = 0] = timeparts?.split(":") ?? [];
    // Treats the string as UTC, but you can remove the `Date.UTC` part and use
    // `new Date` directly to treat the string as local time
    return new Date(Date.UTC(+year, +month - 1, +day, +hours, +minutes, +seconds));
}

const dateString = "2015-12-31 00:00:00";
const d = parseDate(dateString);
console.log(d.toString());

Or with only ES5-level features (since the question is from 2015):

function parseDate(str) {
    var parts = str.split(" ");
    var dateparts = parts[0].split("-");
    var timeparts = (parts[1] || "").split(":");
    var year = +dateparts[0];
    var month = +dateparts[1];
    var day = +dateparts[2];
    var hours = timeparts[0] ? +timeparts[0] : 0;
    var minutes = timeparts[1] ? +timeparts[1] : 0;
    var seconds = timeparts[2] ? +timeparts[2] : 0;
    // Treats the string as UTC, but you can remove the `Date.UTC` part and use
    // `new Date` directly to treat the string as local time
    return new Date(Date.UTC(year, month - 1, day, hours, minutes, seconds));
}

var dateString = "2015-12-31 00:00:00";
var d = parseDate(dateString);
console.log(d.toString());

Answer 2

I can't tell you why. Maybe because iOS doesn't support the Javascript Date function as well as Android, or support a different format?

But I can give you a workaround:

var s = "2015-12-31 00:00:00".split(" ")[0].split("-"),
    d = new Date( s[0], s[1], s[2], 0, 0, 0 );

console.log(d);

---

var s = "2015-12-31 00:00:00".replace(/[ :]/g, "-").split("-"),
    d = new Date( s[0], s[1], s[2], s[3], s[4], s[5] );

console.log(d);

Answer 3

A solution that works for both IOS and Android, and avoid string manipulation when it isn't required is

let fullDate = "1991-03-29 00:00:00";
let date = new Date(fullDate);

// In case its IOS, parse the fulldate parts and re-create the date object.
if(Number.isNaN(date.getMonth())) {
  let arr = fullDate.split(/[- :]/);
  date = new Date(arr[0], arr[1]-1, arr[2], arr[3], arr[4], arr[5]);
}

Answer 4

If anybody is still looking for it.

works for me in IE, Safari, IOS-FF, IOS-Safari ... etc.

getIOSSaveDateObj = function(dateString){
    if(dateString.indexOf('-') > 0){
        var arr = dateString.split(/[- :]/);
        var date = new Date(arr[0], arr[1]-1, arr[2], arr[3], arr[4], arr[5]);
    }else{
        var arr = dateString.split(/[. :]/);
        var date = new Date(arr[2], arr[1]-1, arr[0], arr[3], arr[4], arr[5]);
    }
    return date;
}

Answer 5

I had such a hard time trying to solve this, i finally went for an easier solution and used moment.js. Not much you need to do just declare the dates and works in every device.

Answer 6

Try with var d = new Date("2015/12/31 00:00:00"); Works for me.

Answer 7

Also

var d = new Date("2015/12/31T00:00:00");

works for me :)

Thanks @dda