What is the best way to change the order of array of objects in javascript

Question

What is the easiest way to re-order an array of objects as below.

I want to re-order it based on group value (custom order)

[ { groupValue: 'Corp',
    doclist: { numFound: 259, start: 0, maxScore: 1.1320078, docs: [Object] } },
  { groupValue: 'Phone',
    doclist: { numFound: 7975, start: 0, maxScore: 1.2560269, docs: [Object] } },
  { groupValue: 'Shop',
    doclist: { numFound: 9, start: 0, maxScore: 1.2556685, docs: [Object] } } ]

If I pass in argument with the group value, that particular object corresponding to the group value should come up on the top

Something like

function ("Shop",originalArray){
 return newArray;
}

Should return:

    [ { groupValue: 'Shop',
        doclist: { numFound: 9, start: 0, maxScore: 1.2556685, docs: [Object] } },
{ groupValue: 'Corp',
        doclist: { numFound: 259, start: 0, maxScore: 1.1320078, docs: [Object] } },
      { groupValue: 'Phone',
        doclist: { numFound: 7975, start: 0, maxScore: 1.2560269, docs: [Object] } }]

Answer 1

This should work, gives a new array and should go through the original just once.

 var data = [{ groupValue: 'Corp', doclist: { numFound: 259, start: 0, maxScore: 1.1320078, docs: [Object] } }, { groupValue: 'Phone', doclist: { numFound: 7975, start: 0, maxScore: 1.2560269, docs: [Object] } }, { groupValue: 'Shop', doclist: { numFound: 9, start: 0, maxScore: 1.2556685, docs: [Object] } }]; function goFirst(d, daFirst) { var r = []; d.forEach((e) => { if (e['groupValue'] === daFirst) r.unshift(e); else r.push(e); }) return r; } console.log(goFirst(data, 'Shop'));

Answer 2

You can pass a custom function to Array.prototype.sort :

function sortBy(arr, val, prop) {
    return arr.sort(function(a,b) {
        if (b[prop] == val) return 1;
        return 0;
    });
 }

console.log(sortBy(arr, "Shop", "groupValue"))

As the order for the rest of the elements is important for you (should stay the same), go with this:

function sortBy(arr, val, prop) {
  var top = [];
  var rest = [];
    /* see https://developer.mozilla.org/de/docs/Web/JavaScript/Reference/Statements/for...of 
    for "for of" loops, you might want to use a forEach() loop as "for of" isn't supported in many browsers as of now
    */
  for (var el of arr) {  
    if (el[prop] == val) {
        top.push(el)
    } else {
        rest.push(el);
    }
  }
  return top.concat(rest);
}

 console.log(sortBy(arr, "Shop", "groupValue"))

Answer 3

You can to use splice to move the elements in the array:

 var arr = [ { groupValue: 'Corp', doclist: { numFound: 259, start: 0, maxScore: 1.1320078 } }, { groupValue: 'Phone', doclist: { numFound: 7975, start: 0, maxScore: 1.2560269 } }, { groupValue: 'Shop', doclist: { numFound: 9, start: 0, maxScore: 1.2556685 } } ]; function move(option,originalArray){ var newArray = originalArray.slice(); newArray.splice(0,0,newArray.filter(item => item.groupValue == option)[0]); return newArray; } console.log(move("Shop",arr));

splice first 0 indicate where to put the new value. The second 0 indicate what to do with the other elements (0 indicate move them), the third argument is the value.

Answer 4

You can use the "sort" function to place the item first according to the value

 var originalArray = [{ groupValue: 'Corp', doclist: { numFound: 259, start: 0, maxScore: 1.1320078, docs: [Object] } }, { groupValue: 'Phone', doclist: { numFound: 7975, start: 0, maxScore: 1.2560269, docs: [Object] } }, { groupValue: 'Shop', doclist: { numFound: 9, start: 0, maxScore: 1.2556685, docs: [Object] } } ] var reorder = function (attr, originalArray){ var newArray = originalArray.slice() // clone array newArray.sort(function(a){return a.groupValue !== attr?1:-1}) // put in first return newArray; } // groupValue === Shop in first console.log(reorder("Shop", originalArray))