Sorting array doesn't work properly when some items have unknown values

May 8, 2022

Say I have array of objects

[
  {
      "name": "John", 
      "height": "172", 
      "weight": "87"
  }, 
  {
      "name": "Tom", 
      "height": "167", 
      "weight": "67"

  }, 
  {
      "name": "James", 
      "height": "156", 
      "weight": "uknown"
  }, 
  {
      "name": "Jeremy", 
      "height": "unknown", 
      "weight": "85"
  }, 
]

Now if I want to sort them by height I can do persons.sort((a, b) => b.height - a.height); likewise if I want to sort them by weight I can do the same but with weight persons.sort((a, b) => b.weight - a.weight);

So far this would work fine, however some of the values are unknown, and if I’m holding this array in some state and sort them by either the unknown values mess it up and it doesn’t sort properly. In a case where there are alot more objects that 4, it sorts to some point but as soon as it hits an object with an unknown property it messes it up and the rest of the array is then not sorted properly. How can I overcome this? Perhaps doing something pushing the items with unknown value at the bottom?

>Solution :

All you have to do is handle the specific cases when height/weight is unknown and return the appropriate value

For example:

const items = [
  {
      "name": "John", 
      "height": "172", 
      "weight": "87"
  }, 
  {
      "name": "Tom", 
      "height": "167", 
      "weight": "67"

  }, 
  {
      "name": "James", 
      "height": "156", 
      "weight": "uknown"
  }, 
  {
      "name": "Jeremy", 
      "height": "unknown", 
      "weight": "85"
  }, 
    {
      "name": "Jeremy2", 
      "height": "162", 
      "weight": "85"
  }, 
    {
      "name": "Jeremy3", 
      "height": "unknown", 
      "weight": "85"
  }, 
];

items.sort((a,b) => {
  if(b.height === 'unknown' && a.height ==='unknown') return 0;
  else if(b.height === 'unknown') return -1;
  else if(a.height === 'unknown') return 1;
  else return a.height - b.height;
});

console.log(items);

The comparator function compare(a, b) works like this:

if return value sort > 0, sort b before a.
else if return value sort < 0, sort a before b.
else if return value === 0  keep original order of a and b.

MDN Link

Edit:

If one is dealing with comma seperated strings, one convert to number first:

items.sort((a,b) => {
  if(b.height === 'unknown' && a.height ==='unknown') return 0;
  else if(b.height === 'unknown') return -1;
  else if(a.height === 'unknown') return 1;
  else return parseFloat(a.height.replace(/,/g, '')) -
parseFloat(b.height.replace(/,/g, ''))
});

Source