How do I sort this Array of objects using Vanilla or lodash

Question

I have this object returned to me through an angular HttpClient Observable.

{
"jsonrpc": "2.0",
"result": [
{
  "event": {
    "id": "29688772",
    "name": "Demoliner/Middelkoop v Behar/Escobar",
    "countryCode": "AR",
    "timezone": "UTC",
    "openDate": "2020-02-08T20:00:00.000Z"
  },
  "marketCount": 1
},
{
  "event": {
    "id": "29691591",
    "name": "Bemelmans v Pellegrino",
    "countryCode": "FR",
    "timezone": "UTC",
    "openDate": "2020-02-09T09:00:00.000Z"
  },
  "marketCount": 1
},
{
  "event": {
    "id": "29690566",
    "name": "Diez v Emil Ruusuvuori",
    "countryCode": "NL",
    "timezone": "UTC",
    "openDate": "2020-02-08T13:14:00.000Z"
  },
  "marketCount": 1
},
{
  "event": {
    "id": "29690822",
    "name": "Koepfer v J Rodionov",
    "countryCode": "US",
    "timezone": "UTC",
    "openDate": "2020-02-08T18:00:00.000Z"
  },
  "marketCount": 1
},
{
  "event": {
    "id": "29691586",
    "name": "Basic v Vanni",
    "countryCode": "FR",
    "timezone": "UTC",
    "openDate": "2020-02-09T09:00:00.000Z"
  },
  "marketCount": 1
},
{
  "event": {
    "id": "29691596",
    "name": "P Kotov v Mayot",
    "countryCode": "FR",
    "timezone": "UTC",
    "openDate": "2020-02-09T09:00:00.000Z"
  },
  "marketCount": 1
}

I want to sort the array by openDate.

I was thinking to do it in the subscription like so

getTennisMatches() {
this.betfairService.getTennisMatches().subscribe((data: any[]) => {
  this.matches = data;
  this.sortedMatches = this.matches.sort((a, b) => (a.result.event.openDate > b.result.event.openDate) ? 1 : -1);
  // OR
  this.sortedMatches = _.sortBy(this.matches.result, o => o.result.event.openDate);
});

}

Both sort methods are not working with errors this.matches.sort is not a function for vanilla or Cannot read property 'event' of undefined for lodash

I think I have to iterate over the events but I'm not sure what I'm doing. I'm using lodash because I find it's syntax easier to understand but I don't have to use it. Thanks

The array is this.matches.result, not this.matches. And your sort comparator function should return a number, not a boolean. — Pointy
– Pointy, Commented Feb 8, 2020 at 13:30
Thanks for your quick response. I thought it was returning a number either a 1 or a minus 1. Sorry I'm a bit confused. — Bwizard
– Bwizard, Commented Feb 8, 2020 at 13:34
1. it doesn't return 1 or -1 but 1 or 0. 2. Even then, you have to return three values, not two. It's important to know if two items are equal. Sorting in JavaScript: Shouldn't returning a boolean be enough for a comparison function? — VLAZ
– VLAZ, Commented Feb 8, 2020 at 13:38

LukStorms · Accepted Answer · 2020-02-08 14:31:33Z

1

Instead of sorting the matches object, you could sort the result array inside the object.

this.matches.result.sort((a, b) => Date.parse(a.event.openDate) - Date.parse(b.event.openDate));

But do note that this will also sort the original object.

Simplified example snippet:

let matches = {
result : [
  { id:1001 , event: { openDate : "2020-02-03T20:00:00.000Z" } },
  { id:1002 , event: { openDate : "2020-02-01T20:00:00.000Z" } },
  { id:1003 , event: { openDate : "2020-02-03T20:00:00.000Z" } },
  { id:1004 , event: { openDate : "2020-02-04T20:00:00.000Z" } },
  { id:1005 , event: { openDate : "2020-02-02T20:00:00.000Z" } }
]
};

let sorted = matches.result.sort((a, b) =>  Date.parse(a.event.openDate) - Date.parse(b.event.openDate));

console.log('original object after sort', JSON.stringify(matches));

edited Feb 8, 2020 at 14:31

answered Feb 8, 2020 at 13:46

LukStorms

29.8k5 gold badges36 silver badges49 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

German Cosano · Accepted Answer · 2020-02-08 13:51:12Z

0

this.matches.sort is not a function indicates that your variable this.matches is empty and you are trying to iterates over it so first you have to check your response from the MS call. Can be retrieving an empty array.

type instead of 'any' will be helpfully for your propose to check in case that it works and retrieve some data but they do not have the expected format.

Can also check 'Network' section in Chrome dev tool to watch the response.

answered Feb 8, 2020 at 13:51

German Cosano

1071 silver badge4 bronze badges

Collectives™ on Stack Overflow

How do I sort this Array of objects using Vanilla or lodash

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related