JS order array of objects by object property (dollars)

Question

I am having a heck of a time figuring this one out. I have an array of objects in my vuejs app like so:

var food= [{'name':'apples','price':'222.30'},{'name':'bananas','price':'99.30'},{'name':'oranges','price':'199.30'}];

When I try to sort by price, I am trying both

return food.sort((a, b) => (a.price> b.price) ? 1 : -1);
AND
return _.orderBy(food, 'price')

However it seems this interprets the price $99.30 as higher than $222.30 - I am assuming because 9 is higher than 2?

Any help would be appreciated! I am also wondering if there is a way to order largest to smallest and vice versa.

Do the prices have to be in single quotes. Could be causing the issue? — Siemens
– Siemens, Commented Apr 5, 2021 at 19:51

Josh · Accepted Answer · 2021-04-05 19:51:36Z

4

You have to convert the price to a number and use in your sort callback

return food.sort((a, b) => parseFloat(a.price) -  parseFloat(b.price));

edited Apr 5, 2021 at 19:51

answered Apr 5, 2021 at 19:50

Josh

8415 silver badges9 bronze badges

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

Comments

0xLogN · Accepted Answer · 2021-04-05 19:50:06Z

1

The problem with your code, is the values are strings.

A simple fix:

return food.sort((a, b) => (parseFloat(a.price) > parseFloat(b.price)) ? 1 : -1);

answered Apr 5, 2021 at 19:50

0xLogN

3,8831 gold badge20 silver badges40 bronze badges

1 Comment

epascarello Over a year ago

Quote: "That's... not how sort() works it expects 0, 1, or -1" And when it is equal?

Ran Turner · Accepted Answer · 2021-04-05 19:53:33Z

0

Just use Number

var food= [{'name':'apples','price':'222.30'},{'name':'bananas','price':'99.30'},{'name':'oranges','price':'199.30'}];


food.sort((a, b) => (Number(a.price) > Number(b.price)) ? 1 : -1);

console.log(food);

answered Apr 5, 2021 at 19:53

Ran Turner

18.7k9 gold badges60 silver badges60 bronze badges

Comments

abhinavsinghvirsen · Accepted Answer · 2021-04-05 19:55:55Z

0

Your sort is not working as aspected because you comparing price as string

var food= [{'name':'apples','price':'222.30'},{'name':'bananas','price':'99.30'},{'name':'oranges','price':'199.30'}];

 function compare( a, b ) {
  if ( parseFloat(a.price) < parseFloat(b.price) ){
    return -1;
  }
  if ( parseFloat(a.price) > parseFloat(b.price) ){
    return 1;
  }
  return 0;
}

food.sort( compare );

or


food.sort((a, b) => (parseFloat(a.price) > parseFloat(b.price)) ? 1 : -1);

answered Apr 5, 2021 at 19:55

abhinavsinghvirsen

2,10519 silver badges26 bronze badges

Comments

tauzN · Accepted Answer · 2021-04-06 07:54:33Z

0

The prices are stored as strings; this makes it hard. It will compare each price as strings, one character at a time, left to right.

Consider converting to floats and simplifying the code:

return food.sort((a, b) => parseFloat(a.price) - parseFloat(b.price));

edited Apr 6, 2021 at 7:54

answered Apr 5, 2021 at 19:49

tauzN

7,4872 gold badges22 silver badges23 bronze badges

Collectives™ on Stack Overflow

JS order array of objects by object property (dollars)

5 Answers 5

Comments

1 Comment

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

Comments

1 Comment

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related