Lodash does not sort objects correctly

Question

I'm trying to sort objects based by its property (price)

var arr = [{
        name: 'Apple',
        price: '1.03'
    },
    {
        name: 'Cherry',
        price: '0.33'
    },
    {
        name: 'Mango',
        price: '0.53'
    }
]

Now i use lodash to sort it by its price:

arr = _.sortBy(arr, 'price' ).reverse();

Now arr[0] should be Apple, since it's price is highest, but it's not. What could be wrong?

As `price` is a string in your array, you might have some unexpected results. — Mohammad Usman, Mar 04 '18 at 12:18
I imagine that Lodash is using an alphabetical sort rather than a numerical one, because your `price` fields are strings rather than numbers. — Aaron Christiansen, Mar 04 '18 at 12:18
@MohammadUsman is right, but I am getting the results correct pretty well.. https://jsfiddle.net/L7y9kbhh/4/ — Sid, Mar 04 '18 at 12:19
This https://stackoverflow.com/questions/979256/sorting-an-array-of-javascript-objects might help you — Tung, Mar 04 '18 at 12:20
@MohammadUsman yes! I used parseFloat and now it's all gucci, thank you! — Petras Vilkelis, Mar 04 '18 at 12:22
Dunno why you use lodash for this, in POJS: `arr.sort((a,b) => b.price - a.price)` (for highest value at lowest index). — RobG, Mar 04 '18 at 12:23

score 1 · Answer 1 · answered Mar 05 '18 at 13:23

As everyone is mentioning you are sorting Strings so your outcome is not what you are expecting. To sort based on price use the following (or similar):

var arr = [{
        name: 'Apple',
        price: '1.03'
    },
    {
        name: 'Cherry',
        price: '0.33'
    },
    {
        name: 'Mango',
        price: '0.53'
    }
]

arr.sort(function(a, b){
 return parseFloat(b.price) - parseFloat(a.price);
});

console.log(arr);

score 0 · Answer 2 · answered Mar 07 '18 at 18:33

Since there isn't an answer using Lodash here, I am going to provide one in case someone else stumbles across this question in the future:

// Your code:
var arr = [{
        name: 'Apple',
        price: '1.03'
    },
    {
        name: 'Cherry',
        price: '0.33'
    },
    {
        name: 'Mango',
        price: '0.53'
    }
]

// Yours that isn't working:
// arr = _.sortBy(arr, 'price' ).reverse();

const sortedArr = _.chain(arr)
  .map((val) => _.toNumber(val.price))
  .sortBy()
  .value();
  
console.log(sortedArr);

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.5/lodash.min.js"></script>

score 0 · Answer 3 · answered Mar 07 '18 at 18:43

Since the price value inside each object is a string, you are getting a different result. You can take advantage of function callback and convert your price value to a number and the use sortBy to sort your data based on the numeric value of price.

var arr = [{name: 'Apple',price: '1.03'},{name: 'Cherry',price: '0.33'},{name: 'Mango',price: '0.53'}];
_.sortBy(arr, ({price}) => +price);
console.log(arr);

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.5/lodash.min.js"></script>

score 0 · Answer 4 · answered Oct 10 '19 at 22:02

If you are using LoDash, this is how i did it:

var arr = [{name: 'Apple',price: '1.03',weight:'12'},{name: 'Cherry',price: '0.33', 
weight:'12',weight:'12'},{name: 'Mango',price: '0.53',weight:'12'}];

SortyBy(sortName, SortType, order)
{

  if(SortType == 1)
  {
       _.orderBy(arr,[function(o) { return parseFloat(o[sortName]); }],order);
  }
  else
  {
      _.orderBy(arr,[function(o) { return o[sortName]; }], order);
  }
}

//you would then call:
SortBy("price",1, "asc");
SortBy("weight",1, "asc");
SortBy("name",0,"desc");`

Lodash does not sort objects correctly

4 Answers4