Object.values messes up order of dates in JS

Question

I have a problem. When applying Object.values() on an object it ruins the current order, any ideas how I can keep the order?

I have the following: console.log(formattedReads) which returns

{12: {…}, 18: {…}, 19: {…}, 20: {…}, 21: {…}, 26: {…}, 05: {…}, 06: {…}, 07: {…}, 08: {…}} // structure preview in console log, actual data below
05: {date: "05", goal_achieved: false, reads: 62, dayOfWeek: "Tuesday", nonFormattedDate: "2020-05-05"}
06: {date: "06", goal_achieved: false, reads: 15, dayOfWeek: "Wednesday", nonFormattedDate: "2020-05-06"}
07: {date: "07", goal_achieved: false, reads: 2, dayOfWeek: "Thursday", nonFormattedDate: "2020-05-07"}
08: {date: "08", goal_achieved: false, reads: 5, dayOfWeek: "Friday", nonFormattedDate: "2020-05-08"}
12: {date: "12", goal_achieved: false, reads: 10, dayOfWeek: "Tuesday", nonFormattedDate: "2020-05-12"}
18: {date: "18", goal_achieved: false, reads: 2, dayOfWeek: "Monday", nonFormattedDate: "2020-05-18"}
19: {date: "19", goal_achieved: true, reads: 0, dayOfWeek: "Tuesday", nonFormattedDate: "2020-05-19"}
20: {date: "20", goal_achieved: false, reads: 4, dayOfWeek: "Wednesday", nonFormattedDate: "2020-05-20"}
21: {date: "21", goal_achieved: false, reads: 1, dayOfWeek: "Thursday", nonFormattedDate: "2020-05-21"}
26: {date: "26", goal_achieved: false, reads: 0, dayOfWeek: "Tuesday"}
__proto__: Object

but then when I apply console.log(Object.values(formattedReadsByDay));

(10) [{…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}] // structure preview in console log, actual data below
0: {date: "12", goal_achieved: false, reads: 10, dayOfWeek: "Tuesday", nonFormattedDate: "2020-05-12"}
1: {date: "18", goal_achieved: false, reads: 2, dayOfWeek: "Monday", nonFormattedDate: "2020-05-18"}
2: {date: "19", goal_achieved: true, reads: 0, dayOfWeek: "Tuesday", nonFormattedDate: "2020-05-19"}
3: {date: "20", goal_achieved: false, reads: 4, dayOfWeek: "Wednesday", nonFormattedDate: "2020-05-20"}
4: {date: "21", goal_achieved: false, reads: 1, dayOfWeek: "Thursday", nonFormattedDate: "2020-05-21"}
5: {date: "26", goal_achieved: false, reads: 0, dayOfWeek: "Tuesday"}
6: {date: "05", goal_achieved: false, reads: 62, dayOfWeek: "Tuesday", nonFormattedDate: "2020-05-05"}
7: {date: "06", goal_achieved: false, reads: 15, dayOfWeek: "Wednesday", nonFormattedDate: "2020-05-06"}
8: {date: "07", goal_achieved: false, reads: 2, dayOfWeek: "Thursday", nonFormattedDate: "2020-05-07"}
9: {date: "08", goal_achieved: false, reads: 5, dayOfWeek: "Friday", nonFormattedDate: "2020-05-08"}
length: 10
__proto__: Array(0)

Well Objects really are not meant to maintain order. You can apply a sort to the array based on Date — epascarello, May 26 '20 at 16:13
Objects have no order. "An ECMAScript object is an unordered collection of properties". You want to use an array if order is important. — Moritz Roessler, May 26 '20 at 16:15
https://stackoverflow.com/a/16542597/1487756 - https://2ality.com/2015/10/property-traversal-order-es6.html — Moritz Roessler, May 26 '20 at 16:15
The `Object.values` returns an array using a numerical order when we're using numeric keys. — Ele, May 26 '20 at 16:16
@r00t- as epascarello said, just sort the array. It is also not clear how you are constructing `formattedReadsByDay` from the `formattedReads`. — Bergi, May 26 '20 at 16:20

score 0 · Answer 1 · answered May 26 '20 at 16:27

0

Quick and easy way was to apply this and it'll keep the order.

Object.keys(formattedReadsByDay)
 .sort()
 .map(key => formattedReadsByDay[key])[0].nonFormattedDate,)

answered May 26 '20 at 16:27

r00t -

225
1
2
12

Object.values messes up order of dates in JS

1 Answers1