Javascript array object manipulation [duplicate]

Question

I have this array/object of JavaScript

[
  {
    "name": "A",
    "selected_color": "Red"
  },
  {
    "name": "B",
    "selected_color": "Green"
  },
  {
    "name": "C",
    "selected_color": "Blue"
  },
  {
    "name": "D",
    "selected_color": "Red"
  }
]

How can I convert it to following format?

[
  {
    "color": "Red",
    "count": "2"
  },
  {
    "color": "Green",
    "count": "1"
  },
  {
    "color": "Blue",
    "count": "1"
  }
]

I want to filter values based on 'selected_color' key, also 'count' will store how many time specific color was selected.

Welcome to SO. You might find reading the site help section useful when it comes to asking a good question, and this question checklist. Code that you've worked on to solve the problem should include a minimal reproducible example, and be included in your question. — Louys Patrice Bessette
– Louys Patrice Bessette, Commented Jul 19, 2022 at 12:11

AdityaParab · Accepted Answer · 2022-07-19 12:14:22Z

1

Use .reduce

const arr = [
  {
    "name": "A",
    "selected_color": "Red"
  },
  {
    "name": "B",
    "selected_color": "Green"
  },
  {
    "name": "C",
    "selected_color": "Blue"
  },
  {
    "name": "D",
    "selected_color": "Red"
  }
];

const op = arr.reduce((acc, cur) => {
  const {selected_color} = cur;
  const colorObj = acc.find(({color}) => color === selected_color );

  if(colorObj) {
    colorObj.count++;
  } else {
    acc.push({color: selected_color, count: 1});
  }

  return acc;
  
}, []);

console.log(op);
/*

[
  { color: 'Red', count: 2 },
  { color: 'Green', count: 1 },
  { color: 'Blue', count: 1 }
]

*/

answered Jul 19, 2022 at 12:14

AdityaParab

7,1003 gold badges30 silver badges40 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

nem0z · Accepted Answer · 2022-07-19 12:21:22Z

1

You can try this (using groupBy) :

let data = [
{
    "name": "A",
    "selected_color": "Red"
},
{
    "name": "B",
    "selected_color": "Green"
},
{
    "name": "C",
    "selected_color": "Blue"
},
{
    "name": "D",
    "selected_color": "Red"
}
];

let groupBy = (arr, key) => {
    return arr.reduce((rv, x) => {
        (rv[x[key]] = rv[x[key]] || []).push(x);
        return rv;
    }, {});
};

let groupedData = groupBy(data, "selected_color");
let result = Object.keys(groupedData).map(color => ({'color': color, 'count': groupedData[color].length}) );

console.log(result);

answered Jul 19, 2022 at 12:21

nem0z

1,1371 gold badge7 silver badges23 bronze badges

Collectives™ on Stack Overflow

Javascript array object manipulation [duplicate]

2 Answers 2

Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Linked

Related