How do I change the order of a key in an object?

Question

{
  c1:[],
  c2:[],
  c3:[],
  c4:[],
  c5:[] // This key value pair should be positioned after c2
}

How do I change the position of "c5" to be after "c2"

The keys in JavaScript object is unordered. You can put values in an array if you want to have an guaranteed order. — balrundev, Nov 10 '21 at 15:03
@balrundev not true, they actually maintain the order in which they are inserted. See [this](https://stackoverflow.com/questions/5525795/does-javascript-guarantee-object-property-order) So you would have to create a new object and insert them in the order you want them in. — Jason Goemaat, Nov 10 '21 at 15:05
@balrundev - I think [it isn't _quite_ that simple](https://stackoverflow.com/questions/5525795/does-javascript-guarantee-object-property-order#5525820)... — Alexander Nied, Nov 10 '21 at 15:06
This sounds like an XY Problem. *Why* do you want this? What's the underlying problem you're trying to solve? — David, Nov 10 '21 at 15:07
When I ran into the issue was using a library to convert an object to xml, where the xml schema required a certain order. — Jason Goemaat, Nov 10 '21 at 15:09
Based on these keys I render grid column and suppose I make a clone of "c2" then I want to add "c3" with empty array next to "c2" and existing "c3" will change to "c4...c5...c6" — Pravin Gaikwad, Nov 10 '21 at 15:11
@PravinGaikwad: If your rendering needs to follow specific logic, what prevents you from adding that logic to the rendering? — David, Nov 10 '21 at 15:12
@JasonGoemaat, according to ES specification (https://www.ecma-international.org/wp-content/uploads/ECMA-262_11th_edition_june_2020.pdf) "The mechanics and order of enumerating the properties is not specified..." You're right, most browsers return properties in the same order as they were inserted, but it is not guaranteed. — balrundev, Nov 10 '21 at 15:13
The main point is that order of properties is problematic at worst and hard to understand at best. Relying on it is asking for trouble. My suggestion, your data structure should be an array of key value pairs. `[{key: 'c1', value:[]}, {key: 'c2', value:[]}]` — Ruan Mendes, Nov 10 '21 at 19:46
I’m voting to close this question because it assumes that there is an order in the keys of an object. Under that assumption, then it's a dupe of https://stackoverflow.com/questions/5525795/does-javascript-guarantee-object-property-order — Ruan Mendes, Nov 10 '21 at 19:52
@balrundev Do a search in that PDF for `ownPropertyKeys` for the 2020 definition or in the [ECMAScript 2015 spec](https://262.ecma-international.org/6.0/#sec-ordinary-object-internal-methods-and-internal-slots-ownpropertykeys). Looks like that was [a spec change](https://www.stefanjudis.com/today-i-learned/property-order-is-predictable-in-javascript-objects-since-es2015/) from ES5 to ES6 that made sure `Object.keys` uses that order. — Jason Goemaat, Nov 11 '21 at 14:38

score 1 · Answer 1 · answered Nov 10 '21 at 19:51

Relying on order of properties is often avoided because though browsers behave in the same way in the common cases, the behavior is not guaranteed for edge cases. Understanding those cases is not an easy task.

Sugestion

Use an array of key/value pairs. An array is a natural way to indicate order. Using indexes from a literal definition is not that common or natural.

[{key: 'c1', value:[]},  {key: 'c2', value:[]}]

You probably already know how to answer your original question if you do that.

How do I change the order of a key in an object?

1 Answers1