Javascript :GroupBy 键、还原函数实例

56 阅读1分钟

对象阵列Groupby键

有时在从后端获取数据后,我们想使用group by选项来显示数据。数组包含对象的列表,每个对象包含多个键和值。

我们有多种方法可以实现对象数组的分组

首先,让我们声明对象的数组,每个对象包含键和值。

var emps = [
    {
      name: "frank",
      id: 1,
      department:"sales"
    },
    {
        name: "john",
        id: 2,
        department:"hr"
      },
      {
        name: "eric",
        id: 3,
        department:"sales"
      },
      {
        name: "andrew",
        id: 4,
        department:"sales"
      }];
 

## using lodash groupBy examples

lodash is popular library which provides lot useful inbuilt utility methods.
This is very easy to implement in the projects
groupBy method takes collection of objects

```html
_.groupBy(collection, [iteratee=_.identity])

输入是对象的数组,iteratee是对象的属性,用于分组。

下面是一个按部门对雇员对象进行分组的例子

var emps = [
    {
      name: "frank",
      id: 1,
      department:"sales"
    },
    {
        name: "john",
        id: 2,
        department:"hr"
      },
      {
        name: "eric",
        id: 3,
        department:"sales"
      },
      {
        name: "andrew",
        id: 4,
        department:"sales"
      }];
 
_.groupBy(emps, 'department');

而输出的结果是部门的分组

hr: [Object {department: "hr", id: 2, name: "john"}]
sales: [Object {department: "sales", id: 1, name: "frank"}, Object {department: "sales", id: 3, name: "eric"}

ES6数组内置的还原函数groupby例子

EcmaScript 2005年提供了数组内置方法 。减少函数提供了reduce

function groupBy(arrayObjects, key) {
    return arrayObjects.reduce(function(result, currentObject) {
        const val = currentObject[key]
        result[val] = result[val] || []
        result[val].push(currentObject)
        return result
    }, {})
}

而输出是

{ sales:
   [ { name: 'frank', id: 1, department: 'sales' },
     { name: 'eric', id: 3, department: 'sales' },
     { name: 'andrew', id: 4, department: 'sales' } ],
  hr: [ { name: 'john', id: 2, department: 'hr' } ] }