Loadash orderby descending not working in JavaScript (React Native)

Question

I am getting array from server like below.

[
  {
    id: '508',
    class: 'class1',
    value: '6.0',
    percentage: '8.90',
    color: 'black'
  },
  {
    id: '509',
    class: 'class2',
    value: '14,916',
    percentage: '2.40',
    color: 'black'
  },
  {
    id: '510',
    class: 'class3',
    value: '14,916',
    percentage: '56.40',
    color: 'black'
  },
  {
    id: '511',
    class: 'class',
    value: '4,916',
    percentage: '2.40',
    color: 'black'
  }
]

From above list, I have to show Maximum percentage values to lowest values.

So, I tried like below.

if (jsonData) {
      const sortedArray = orderBy(
        jsonData,
        ['percentage'],
        ['desc']
      );
      console.log('sortedArray is ', sortedArray);

}

Its coming again same order, Not ordering from maximum values to lowest values.

Any suggestions?

You have weird quotes. And that's not valid JSON, either. Also, you're comparing *strings*, so you probably get the strings order of these. — VLAZ, Mar 27 '19 at 10:06
`maximum percentage value to lowest` ? and `descending order` ? i can't relate. please post expected output too ? — Code Maniac, Mar 27 '19 at 10:06
descending order when they are arranged from the largest to the smallest number — Anilkumar iOS - ReactNative, Mar 27 '19 at 10:08
Possible duplicate of [Sorting an array of JavaScript objects by property](https://stackoverflow.com/questions/979256/sorting-an-array-of-javascript-objects-by-property) — adiga, Mar 27 '19 at 10:15

realappie · Answer 1 · 2019-03-27T10:17:41.237

I have updated your post to use actual javascript strings, but beside that. Your percentage property is a string and not a number so the ordering is done differently by lodash. Either ensure the percentages come back as proper numbers from the server or map them to a number.

var data = [
  {
    id: '508',
    class: 'class1',
    value: '6.0',
    percentage: '8.90',
    color: 'black'
  },
  {
    id: '509',
    class: 'class2',
    value: '14,916',
    percentage: '2.40',
    color: 'black'
  },
  {
    id: '510',
    class: 'class3',
    value: '14,916',
    percentage: '56.40',
    color: 'black'
  },
  {
    id: '511',
    class: 'class',
    value: '4,916',
    percentage: '2.40',
    color: 'black'
  }
];

var correctedData = data.map( element => {
  // This will be a copy of every element, with the addition
  // of a new percentage value.
  // 
  var correctedElement = { 
    ...element,
    percentage: parseFloat(element.percentage)
  }
  return correctedElement;
});

var sortedArray = _.orderBy(correctedData, ['percentage'], ['desc']);

console.log(sortedArray)

<script src="https://cdn.jsdelivr.net/npm/lodash@4.17.11/lodash.min.js"></script>

score 2 · Accepted Answer · answered Mar 27 '19 at 10:09

2

You can simply use sort function of native JS

let arr = [{ id: '508',class: 'class1',value: '6.0',percentage: '8.90',color: 'black' },{ id: '509',class: 'class2',value: '14,916',percentage: '2.40',color: 'black' },{ id: '510',class: 'class3',value: '14,916',percentage: '56.40',color: 'black' },{ id: '511',class: 'class4',value: '4,916',percentage: '2.40',color: 'black' }]

let op = arr.sort(({percentage:A},{percentage:B})=>parseFloat(B) - parseFloat(A))

console.log(op)

answered Mar 27 '19 at 10:09

Code Maniac

37,143
5
39
60

2

there are multiple duplicates available – brk Mar 27 '19 at 10:10
His problem is not his sorting strategy, but rather his numbers being strings. Pointing that out is in my opinion more valuable than simply posting a working piece of code. But cool you could do that with native JS :D! – realappie Mar 27 '19 at 10:14
@brk in that case, please close them. You have the hammer. – adiga Mar 27 '19 at 10:19

Loadash orderby descending not working in JavaScript (React Native)

2 Answers2