Sort JavaScript Object by Attribute

Question

I'm trying to sort an array of comment objects by their "body" attribute.

I'm trying to run the following (console.log(comment) successfully shows the array) but when I go to sort it, I just get the same array back - even after defining it as a sortedArray variable.

I've seen some similar questions, but not quite with the arrow function syntax that I'm trying to implement.

Below is my code:

function sortComments() {
  $("#sort_comments").on("click", function(e) {
    e.preventDefault();
    var id = this.dataset.linkid
    fetch(`/links/${id}/comments.json`)
      .then(r => r.json())
      .then(comments =>
        comments.sort(function(a, b) {
          return a.body - b.body;
        })
      );
  });
}

Thank you for your help.

What is the value of a.body or b.body ? a.body - b.body only works if the values are numbers. — Felix Kling
– Felix Kling, Commented Jan 29, 2019 at 23:00
Try comments.sort((a, b) => -(a.body < b.body) || +(a.body > b.body)) — Patrick Roberts
– Patrick Roberts, Commented Jan 29, 2019 at 23:22

Josep · Accepted Answer · 2019-01-29 23:24:09Z

1

What's probably happening here is that the body attribute is a string and not a number, therefore the result of that subtraction returns NaN, and if that's the case the order of the Array won't change.

In order to compare 2 different strings you probably want to use localeCompare, like this:

function sortComments() {
    $("#sort_comments").on("click", function (e) {
        e.preventDefault();
        var id = this.dataset.linkid
        fetch(`/links/${id}/comments.json`)
          .then(r => r.json())
          .then(comments => 
             comments.sort(({body: a}, {body: b}) => a.localeCompare(b))
          );
    };
}

edited Jan 29, 2019 at 23:24

answered Jan 29, 2019 at 23:13

Josep

13.1k2 gold badges44 silver badges45 bronze badges

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

5 Comments

James Over a year ago

Thank you, comment.body are in fact strings - should have caught that earlier. After using localeCompare I got a TypeError, which was fixed by forcing a.toString().localCompare(b)), only now I'm not accessing the body of the comment at any point, should I be adding comment.body to my sort?

Josep Over a year ago

@James there was a silly mistake in my original answer, I edited a few minutes ago, please have another look at it... Notice how I am destructuring the body and renaming it to a and b? I wasn't doing that before. There is no reason for you to perform a toString :-)

James Over a year ago

Thanks for the quick edit, @Josep. For some reasons I'm getting undefined errors now. Even this.dataset.linkid is returning undefined - does it have to do with the position of my e.preventDefault()?

Josep Over a year ago

Nope, that's definitely a different problem... If you are getting undefined on the linkid property of the dataset, that can only mean one thing: In the moment when the #sort_comments was clicked, that HTML element does not have the data-linkid attribute set on it... But that's a completely different problem.

James Over a year ago

Ok, I figured as much but was a little confused given that I had that info earlier. Thank you very much for your help!

Collectives™ on Stack Overflow

Sort JavaScript Object by Attribute

1 Answer 1

5 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

5 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related