I have an array of arrays below. With ES6, how can I get a count of each value Good, Excellent & Wow into a new array e.g [{name: Good, count: 4} {name: Excellent, count: 5}, {name:Wow, count:2}] in dynamic style. I am attempting to use Object.assign but I am failing to "unique" out the count of the key plus instead, I need to use an array as I am trying to render this out on the front end. Do I need to use reduce? how?

let k = 0
const stats = {}
const remarks = [
  [{name: "Good"}],
  [{name: "Good"}, {name: "Excellent"}],
  [{name: "Good"}, {name: "Excellent"}, {name: "Wow"}],
  [{name: "Good"}, {name: "Excellent"}, {name: "Wow"}],
  [{name: "Excellent"}],
  [{name: "Excellent"}]
]

remarks.forEach((arr) => {
  arr.map((e) => {
    Object.assign(stats, { [e.name]: k = k + 1 })
  })
})

console.log(stats);

I have an array of arrays below. With ES6, how can I get a count of each value Good, Excellent & Wow into a new array e.g [{name: Good, count: 4} {name: Excellent, count: 5}, {name:Wow, count:2}] in dynamic style. I am attempting to use Object.assign but I am failing to "unique" out the count of the key plus instead, I need to use an array as I am trying to render this out on the front end. Do I need to use reduce? how?

let k = 0
const stats = {}
const remarks = [
  [{name: "Good"}],
  [{name: "Good"}, {name: "Excellent"}],
  [{name: "Good"}, {name: "Excellent"}, {name: "Wow"}],
  [{name: "Good"}, {name: "Excellent"}, {name: "Wow"}],
  [{name: "Excellent"}],
  [{name: "Excellent"}]
]

remarks.forEach((arr) => {
  arr.map((e) => {
    Object.assign(stats, { [e.name]: k = k + 1 })
  })
})

console.log(stats);

Output:

stats: {Good: 8, Excellent: 11, Wow: 9}

Which is Incorrect plus I need to use an array.

Expected output:

[{name: Good, count: 4} {name: Excellent, count: 5}, {name:Wow, count:2}]

• javascript
• arrays
• ecmascript-6

• why have you got type definitions? Are you sure you aren't using typescript? – Ben Commented Aug 22, 2019 at 18:56

9 Answers 9

Flatten the array of arrays and reduce it starting with an object like : { Good: 0, Excellent: 0, Wow: 0}

then .map the Object.entries of the result to transform it to an array :

const remarks = [
  [{ name: "Good" }],
  [{ name: "Good" }, { name: "Excellent" }],
  [{ name: "Good" }, { name: "Excellent" }, { name: "Wow" }],
  [{ name: "Good" }, { name: "Excellent" }, { name: "Wow" }],
  [{ name: "Excellent" }],
  [{ name: "Excellent" }]
];

const result = Object.entries(
  remarks.flat().reduce(
    (all, { name }) => {
      all[name] += 1;
      return all;
    },
    { Good: 0, Excellent: 0, Wow: 0 }
  )
).map(([name, count]) => ({ name, count }));

console.log(result);

You can try below logic:

var data = [[{name: "Good"}],[{name: "Good"}, {name:"Excellent"}],[{name: "Good"}, {name:"Excellent"}, {name:"Wow"}],[{name: "Good"}, {name:"Excellent"}, {name:"Wow"}],[{name:"Excellent"}],[{name:"Excellent"}]]

var nData = [];

(data || []).forEach( e => {
  (e || []).forEach(ei => {
    var i = (index = nData.findIndex(d => d.name === ei.name)) >=0 ? index : nData.length;
    nData[i] = {
      name: ei.name,
      count : (nData[i] && nData[i].count ? nData[i].count : 0)+1
    }
  });
});

console.log(nData);

Hope this helps!

You can use reduce, then convert the result into an array of objects:

const counts = remarks.reduce((result, list) => {
  list.forEach(remark => {
    result[remark.name] = (result[remark.name] || 0) + 1;
  });
}, {});
const finalResult = [];
for (let name in counts) {
  finalResult.push({name, count: counts[name]});
}

You could achieve this pretty easily by:

1) Flattening the nested array into 1 single level array.

2) Iterating over the flat array and create a "count map" by using Array.prototype.reduce

For example:

const remarks = [
  [{
    name: 'Good'
  }],
  [{
    name: 'Good'
  }, {
    name: 'Excellent'
  }],
  [{
    name: 'Good'
  }, {
    name: 'Excellent'
  }, {
    name: 'Wow'
  }],
  [{
    name: 'Good'
  }, {
    name: 'Excellent'
  }, {
    name: 'Wow'
  }],
  [{
    name: 'Excellent'
  }],
  [{
    name: 'Excellent'
  }]
]

const flatten = arr => arr.reduce((accum, el) => accum.concat(el), [])
const map = flatten(remarks).reduce((accum, el) => {
  if (accum[el.name]) {
    accum[el.name] += 1;
  } else {
    accum[el.name] = 1;
  }
  return accum;
}, {});

console.log(map)

First find the counts using reduce than pass that to another function to get the desired view structure:

const Good = 1,
      Excellent = 2,
      Wow = 3;

const remarks = [
  [{name: Good}],
  [{name: Good}, {name:Excellent}],
  [{name: Good}, {name:Excellent}, {name:Wow}],
  [{name: Good}, {name:Excellent}, {name:Wow}],
  [{name:Excellent}],
  [{name:Excellent}]
];

/*
[{name: Good, count: 4} {name: Excellent, count: 5}, {name:Wow, count:2}]
*/

function counts(remarks) {
  return remarks.flat().reduce((acc, v) => {
    const name = v.name;
    let count = acc[name] || 0;
    return {
    ...acc,
    [name]: count + 1
    }
  }, {});
}

function view(counts) {
   return Object.keys(counts).map(key => {
     let count = counts[key];
     return { name: key, count };
   })
}

console.log(view(counts(remarks)));

Any time you are making a smaller set of data, or transforming data, in JavaScript reduce should be the first method you attempt to use. In this case, you may want to pair it with an indexer (hence preloading with an array of index and an array of result).

This works in one pass without needing to know the name values up front.

const remarks = [
  [{name: "Good"}],
  [{name: "Good"}, {name: "Excellent"}],
  [{name: "Good"}, {name: "Excellent"}, {name: "Wow"}],
  [{name: "Good"}, {name: "Excellent"}, {name: "Wow"}],
  [{name: "Excellent"}],
  [{name: "Excellent"}]
];

const stats = remarks.reduce((p,c) => (
  c.forEach( ({name}) => {
    if(!p[0].hasOwnProperty(name)){
      p[1].push({name:name,count:0});
      p[0][name] = p[1].length - 1;
    }
    p[1][p[0][name]].count++;
  }),p),[{},[]])[1];
    
console.log(stats);

A slightly more concise and definitely less readable approach (but it's worth to mention) could be:

const remarks = [
  [{ name: "Good" }],
  [{ name: "Good" }, { name: "Excellent" }],
  [{ name: "Good" }, { name: "Excellent" }, { name: "Wow" }],
  [{ name: "Good" }, { name: "Excellent" }, { name: "Wow" }],
  [{ name: "Excellent" }],
  [{ name: "Excellent" }]
];

const stats = Object.entries(
                remarks
                  .flat()
                  .reduce((acc, {name}) => (acc[name] = -~acc[name], acc), {})))
              ).map(([name, count]) => ({ name, count }));


console.log(stats);

It uses the comma operator in the reducer to returns the accumulator; and the bitwise operator NOT to create a counter without the needs to initialize the object upfront with all the names.

const flattenedRemarks = _.flatten(remarks);

const groupedRemarks = _.groupBy(flattenedRemarks, (remark) => remark.name);

const remarkCounts = _.mapValues(groupedRemarks, (group) => group.length);

const data = {
    "mchale": {
        "classes":["ESJ030", "SCI339"], // get the length
        "faculty":["Hardy", "Vikrum"]   // get the length
     },
    "lawerence":{
        "classes":["ENG001"],  // get the length
        "faculty":["Speedman", "Lee", "Lazenhower"] // get the length
     }
};

const count = Object.keys(data).map(campusName => {
  const campus = data[campusName];
  return Object.keys(campus).map(key => campus[key].length).reduce((p, c) => p + c, 0);
}).reduce((p, c) => p + c, 0);
console.log(count);