Order object by child property

Question

In my Angular4 app, I want to sort my object (obj) by a child key (order in this case), like following:

var obj = {
    signal_a : {
        order : 2,
        signals : []
    },
    signal_b : {
        order : 3,
        signals : []
    },
    signal_c : {
        order : 1,
        signals : []
    }
}

Currently displaying:

1. signal_a
2. signal_b
3. signal_c

Wanted result:

1. signal_c
2. signal_a
3. signal_b

you must make by yourself the ordering, because is not an array is an object... — Álvaro Touzón, Oct 16 '17 at 09:52
I tried looping each object, building a new array where I duplicate the objects to, and afterwards copy them back to an object... I really don't like this method... — user1141796, Oct 16 '17 at 09:55
Javascript object key order has special form, i.e. integer properties are sorted, others appear in creation order. If the object's keys are non-integer, then they are listed in the creation order. — Krusader, Oct 16 '17 at 09:58
Possible duplicate of [Does JavaScript Guarantee Object Property Order?](https://stackoverflow.com/questions/5525795/does-javascript-guarantee-object-property-order) — Hassan Imam, Oct 16 '17 at 10:18

Alexis · Answer 1 · 2017-10-17T09:29:23.383

0

You can achieve this by using Object.keys to get an array of your object properties and sort them by looking their order and recreate a new object based on this new order.

Warning As explain here : Does JavaScript Guarantee Object Property Order? JS can't guarantee the order of the object properties. You have to convert your object into array. Or use map.

var obj = {
    signal_a : {
        order : 2,
        signals : []
    },
    signal_b : {
        order : 3,
        signals : []
    },
    signal_c : {
        order : 1,
        signals : []
    }
};

var orderedObj = {};
Object.keys(obj).sort((a,b) => obj[a].order > obj[b].order ? 1 : -1).forEach(prop => orderedObj[prop] = obj[prop]);
console.log(orderedObj);

Object to array :

var obj = {
    signal_a : {
        order : 2,
        signals : []
    },
    signal_b : {
        order : 3,
        signals : []
    },
    signal_c : {
        order : 1,
        signals : []
    }
};

var objToArray = Object.keys(obj).sort((a,b) => obj[a].order > obj[b].order ? 1 : -1).map(key => {
  return {
  "key":key,
  "value":obj[key]
  };
});

console.log(objToArray);

edited Oct 17 '17 at 09:29

answered Oct 16 '17 at 10:01

Alexis

5,217
1
22
42

1

You can NOT trust on the order of the keys! – Thomas Oct 16 '17 at 10:02
Properties order in objects is not guaranteed in JavaScript; you need to use an Array or Map (ECMAScript 2015). A Map shares some similarities with an Object and guarantees the keys order. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map – Piotr Pasieka Oct 16 '17 at 10:08
Agree with you @PiotrPasieka I just give him a solution to reorder his object at a T moment. The best way is to convert him into array. – Alexis Oct 16 '17 at 10:13
@user1141796 Update answer with an array transformation to guarantee the order. – Alexis Oct 17 '17 at 09:31

Order object by child property

1 Answers1