Link arrays in an object of arrays to sort by one of the arrays

Question

I have an object with the following structure:

let obj = {
    "foo": ["orange", "apple", "pear", "grape", "lime"],
    "bar": [12, 6, 18, 3, 22],
    "bat": ["a", "b", "c", "d", "e"]
};

I want to sort by bar but also retain the order of foo and bat relative to bar , like so:

obj = {
    "foo": ["grape", "apple", "orange", "pear", "lime"],
    "bar": [3, 6, 12, 18, 22],
    "bat": ["d", "b", "a", "c", "e"]
};

Is there a tidy way to do this, or do I need to convert it to an array of arrays, sort by index (eg, arr.sort((a,b) => a[1] - b[1]); ), and convert back to the object?

Answer 1

 const obj = { "foo": ["orange", "apple", "pear", "grape", "lime"], "bar": [12, 6, 18, 3, 22], "bat": ["a", "b", "c", "d", "e"] }; // get original indices of sorted bar const indices = obj.bar .map((value, index) => ({ value, index })) .sort(({ value: a }, { value: b }) => a - b) .map(({ index }) => index); // iterate over obj's values to reorder according to indices const res = Object.entries(obj) .reduce((acc, [key, value]) => ({ ...acc, [key]: indices.map(i => value[i]) }), {}); console.log(res);

Answer 2

You can create a temp array base on all values. Then you can sort that array based on bar . Once sorted, Just fill data to new response while iterating.

 const obj = { foo: ["orange", "apple", "pear", "grape", "lime"], bar: [12, 6, 18, 3, 22], bat: ["a", "b", "c", "d", "e"], }; const arr = obj.bar .map((bar, index) => ({ bar, index, })) .sort((x, y) => x.bar - y.bar); console.log(arr); const res = arr.reduce( (map, { bar, index }, i) => { map.bar[i] = bar; map.foo[i] = obj.foo[index]; map.bat[i] = obj.bat[index]; return map; }, { foo: [], bar: [], bat: [] } ); console.log(res);