CODEWITHSUNDEEP
javascriptjquery
Matias Reynolds
Matias Reynolds

Reputation: 29

sort javascript array by another related value

I have a challenge sorting an array as desired;

Below is my code:

callbacks : {
    onComplete : function(id, filename, response) {                     
        handler.addImage({
            uuid :          response.image_id,
            thumbnailUrl :  response.image_url,
            name :          response.filename
        }, id);
        this.setDeleteFileParams({
            id : response.image_id
        }, id);
        self._images.push(response.image_id); /* here */
    }
}

self._images returns an array with response.image_id but they are not sorted as expected; I need the result ordered by response.filename.

The following example illustrates what I meant;

Given that:

response.image_id -> response.image_id
  8870 -> img03.jpg
  8889 -> img02.jpg
  8875 -> img01.jpg

The result of my function will be:

Array(3)
 0: 8889
 1: 8875
 2: 8870

Instead, this I what I would like to achieve:

Array(3)
 0: 8875
 1: 8889
 2: 8870

What am I doing wrong and how can I fix it?

Upvotes: 2

Views: 67

Answers (4)

Sumer
Sumer

Reputation: 2867

self._images.push(response.image_id); /* here */

In your code above you are only pushing ID and you also need to push filenames . you need to make array of objects with both filename and id. then can sort as below

 self._images.sort((a,b) => a.filename > b.filename)

Upvotes: 0

Bennett Hardwick
Bennett Hardwick

Reputation: 1399

Instead of constructing an array of image_ids, you could construct an array of objects that have both the filename and image_id properties.

self._images.push({
  filename: response.filename,
  image_id: response.image_id
});

Now that you have the filename property, you can sort your array using it.

self._images.sort((a, b) => a.filename.localeCompare(b.filename));

If you want to just get an array of image_id, you can use the native .map() method.

self._images.map(image => image.image_id)

Upvotes: 2

Justin Bugeja
Justin Bugeja

Reputation: 53

Assuming you're using the native sort function in javascript (https://www.w3schools.com/jsref/jsref_sort.asp).

Using this you are able to identify a sorting function in the argument. Try something like:

response.sort(function(responseA, responseB){return responseA.filename-responseB.filename});

Upvotes: 0

Nick Parsons
Nick Parsons

Reputation: 50749

If you have an array of objects like so:

const objs = [
  {8870: "img03.jpg"},
  {8889: "img02.jpg"},
  {8875: "img01.jpg"}
];

You can use Object.values and .sort() with .localeCompare() to sort this array of objects. The Object.values method will give you all the values within a given object. Since all your objects in the array only have one value, we can target index 0 of this array. .localeCompare allows us to compare two strings and sort them using the .sort() method.

See working example below:

const objs = [{
    8870: "img03.jpg"
  },
  {
    8889: "img02.jpg"
  },
  {
    8875: "img01.jpg"
  }
],

res = objs.sort((a, b) => Object.values(a)[0].localeCompare(Object.values(b)[0]));
console.log(res);

Upvotes: 0

Related Questions