1

I need to group by my elements in array so I did in that way:

const cars = [{
        make: "vw",
        model: "passat",
        year: "2012"
    },
    {
        make: "vw",
        model: "golf",
        year: "2013"
    },
    {
        make: "ford",
        model: "mustang",
        year: "2012"
    },
    {
        make: "ford",
        model: "fusion",
        year: "2015"
    },
    {
        make: "kia",
        model: "optima",
        year: "2012"
    }
];

let group = cars.reduceRight((r, a) => {
  r[a.make] = [...r[a.make] || [], a];
  return r;
 }, []);

console.log(cars)
console.log(group)

But unfortunatelly after that grouping with reduce the order of elements is wrong. VW Group is at the end, how can I fource reduce to not sorting elements, or maybe there is better way to group elements?

DEMO: https://www.w3schools.com/code/tryit.asp?filename=GG4TVX5J3X3A

enter image description here

DiPix
  • 4,140
  • 9
  • 47
  • 83
  • 2
    Property insertion order is guaranteed since ES2015, @user2864740. See [this question](https://stackoverflow.com/questions/5525795/does-javascript-guarantee-object-property-order) for exact details. – Klaycon Jun 24 '20 at 16:18
  • @Klaycon Wow, ^_^ – user2864740 Jun 24 '20 at 16:20

1 Answers1

4

reduceRight applies the reduce from right to left. Just don't use the Right variant and it'll be in the original order.

const cars = [{
        make: "vw",
        model: "passat",
        year: "2012"
    },
    {
        make: "vw",
        model: "golf",
        year: "2013"
    },
    {
        make: "ford",
        model: "mustang",
        year: "2012"
    },
    {
        make: "ford",
        model: "fusion",
        year: "2015"
    },
    {
        make: "kia",
        model: "optima",
        year: "2012"
    }
];

let group = cars.reduce((r, a) => {
  r[a.make] = [...r[a.make] || [], a];
  return r;
 }, {});

console.log(cars)
console.log(group)

There was a bug in your original code, you were assigning properties of an array. There's no point to this; use an object instead.

iota
  • 34,586
  • 7
  • 32
  • 51
Klaycon
  • 8,967
  • 6
  • 26
  • I copied your code and VW is still at the end... Why? https://www.w3schools.com/code/tryit.asp?filename=GG4UG5DVQSSO – DiPix Jun 24 '20 at 16:27
  • @DiPix, running that exact code produces a result with VW at the beginning for me. What is your browser? – Klaycon Jun 24 '20 at 16:30
  • I'm using Chrome – DiPix Jun 24 '20 at 16:32
  • @DiPix, not sure what to tell you. The code works in Chrome, Firefox, and Edge both here in the stack snippet and in your TryIt link. Maybe double check you're looking at the correct output? – Klaycon Jun 24 '20 at 16:34
  • Hm weird http://prntscr.com/t5qyn6 It looks that VW is first but when I click to preview content then is at the end. And in fact in dropdown select list VW is at the end. – DiPix Jun 24 '20 at 16:34
  • @DiPix Instead of previewing content, try logging `Object.entries` of the object, as that will show the actual iteration order. – iota Jun 24 '20 at 16:52
  • Like I said in my dropdown VW is at the end :/ – DiPix Jun 24 '20 at 17:07