I have following data:
const data =
[{date: "2022-05-10 13:36:00", open: 155.535, low: 155.4, high: 155.67, close: 155.44},
{date: "2022-05-10 13:35:00", open: 155.23, low: 155.2102, high: 155.62, close: 155.53},
{date: "2022-05-10 13:34:00", open: 154.97, low: 154.96, high: 155.29, close: 155.22}];
I am using following code to sort the data by date (oldest to newest):
const data =
[{date: "2022-05-10 13:36:00", open: 155.535, low: 155.4, high: 155.67, close: 155.44},
{date: "2022-05-10 13:35:00", open: 155.23, low: 155.2102, high: 155.62, close: 155.53},
{date: "2022-05-10 13:34:00", open: 154.97, low: 154.96, high: 155.29, close: 155.22}];
console.log(Object.entries(data).sort((([, a], [, b]) => {
return new Date(a.date) - new Date(b.date)
})).map(i=>{ return i[1]}))
I have following data:
const data =
[{date: "2022-05-10 13:36:00", open: 155.535, low: 155.4, high: 155.67, close: 155.44},
{date: "2022-05-10 13:35:00", open: 155.23, low: 155.2102, high: 155.62, close: 155.53},
{date: "2022-05-10 13:34:00", open: 154.97, low: 154.96, high: 155.29, close: 155.22}];
I am using following code to sort the data by date (oldest to newest):
const data =
[{date: "2022-05-10 13:36:00", open: 155.535, low: 155.4, high: 155.67, close: 155.44},
{date: "2022-05-10 13:35:00", open: 155.23, low: 155.2102, high: 155.62, close: 155.53},
{date: "2022-05-10 13:34:00", open: 154.97, low: 154.96, high: 155.29, close: 155.22}];
console.log(Object.entries(data).sort((([, a], [, b]) => {
return new Date(a.date) - new Date(b.date)
})).map(i=>{ return i[1]}))
In chrome, it renders pretty well, but on safari, it will not work and will maintain the original order.
My question is what makes this difference and how to make the sort algorithem work in all broswer?
Thanks!
P.S. I do check this question, Chrome and Safari javascript .sort() method works differently, but the answers indicated that The sort is not necessarily stable
, but according to mdn now:
Since version 10 (or EcmaScript 2019), the specification dictates that Array.prototype.sort is stable.
What I am missing?
Share Improve this question asked May 11, 2022 at 2:57 JamesJames 2,7872 gold badges9 silver badges31 bronze badges 2-
Better to use dates in the standardized string format with
.toISOString()
so that it'll work across all browsers – CertainPerformance Commented May 11, 2022 at 4:09 - Just pare the ISO date strings? Their lexicographical order is the same as chronological order. – gre_gor Commented May 11, 2022 at 4:29
2 Answers
Reset to default 4You already have the dates formatted in a manner suitable for sorting. So we can write a trivial sorter for them:
const sortByDate = (data) =>
data .sort (({date: a}, {date: b}) => a < b ? -1 : a > b ? 1 : 0)
const data = [{date: "2022-05-10 13:36:00", open: 155.535, low: 155.4, high: 155.67, close: 155.44}, {date: "2022-05-10 13:35:00", open: 155.23, low: 155.2102, high: 155.62, close: 155.53}, {date: "2022-05-10 13:34:00", open: 154.97, low: 154.96, high: 155.29, close: 155.22}]
console .log (sortByDate (data))
.as-console-wrapper {max-height: 100% !important; top: 0}
You can't use subtraction for sorting on strings, but you can do lexicographic sorting. This is very similar to the ISO-8601 format, only with the central T
replaced by a space. It will sort the same way.
In Safari the "YYYY-MM-DD hh:mm:ss"
date format is not supported and calling new Date()
on such a value will always return Invalid Date
. The sort is failing essentially because all values are the same after Date conversion.
To solve this issue, you could
use the
"YYYY/MM/DD hh:mm:ss"
date format
ex.new Date('YYYY-MM-DD hh:mm:ss'.replace(/-/g, "/"))
use
moment
for the string to date conversion (this may be an overkill if you do not needmoment
anywhere else in your code)pare the ISO date strings, as their lexicographical order is the same as chronological order (as mentioned by @gre_gor in the ments)
replace the space in
"YYYY-MM-DD hh:mm:ss"
with aT
, to get"YYYY-MM-DDThh:mm:ss"
which is another accepted format (as mentioned in the linked thread)
There may be other solutions as well, but you get the idea.
For reference:
Invalid date in safari
https://techtalkbook./javascripts-new-date-does-not-work-on-ie-and-safari/