Изменить массив объектов в многомерный массив, сгруппированный по ключу

Question

У меня есть два сценария макета ios и один набор данных. Это исходные данные:

var shape = [
  { name: "fruit", value: 'apple' },
  { name: "fruit", value: 'orange' },
  { name: "rootVegetable", value: 'turnip' },
  { name: "rootVegetable", value: 'carrot' },
  { name: "vegetable", value: 'cabbage' },
  { name: "vegetable", value: 'potato' }
];

И вот как я бы хотел, чтобы это выглядело:

var shape2 = [
  [
    { name: "fruit", value: 'apple' },
    { name: "rootVegetable", value: 'turnip' },
    { name: "vegetable", value: 'cabbage' },
  ],
  [
    { name: "fruit", value: 'orange' },
    { name: "rootVegetable", value: 'carrot' },
    { name: "vegetable", value: 'potato' },
  ]
]

Тогда я мог бы сделать из этого таблицу:

| Fruit  | Root vegetable | Vegetables |
| ------ | -------------- | ---------- |
| apple  | turnip         | cabbage    |
| orange | carrot         | potato     |

Я знаю, что это случай для reduce, но я не могу понять это.

Answer 1

Вы можете попробовать это.

var shape = [
    { name: "fruit", value: 'apple' },
    { name: "fruit", value: 'orange' },
    { name: "rootVegetable", value: 'turnip' },
    { name: "rootVegetable", value: 'carrot' },
    { name: "vegetable", value: 'cabbage' },
    { name: "vegetable", value: 'potato' }
];
function getResult(shape) {
    var fruits = [];
    var rootVegetable = [];
    var vegetable = [];
    var result = [];

    shape.forEach(s => {
        if (s.name == "fruit")
            fruits.push(s);
        else if (s.name == "rootVegetable")
            rootVegetable.push(s);
        else if (s.name == "vegetable")
            vegetable.push(s);
    })

    fruits.forEach((item, idx) => {
        var smallArray = [];
        smallArray.push(item)
        smallArray.push(rootVegetable[idx]);
        smallArray.push(vegetable[idx]);
        result.push(smallArray);
    })

    return result;
}

console.log(getResult(shape));