Question

说我有这个系列：

{
    collections: [
        {
            collection_name: "One",
            url_slug: "one",
            collection_type: "group-one",
            id: 700001
        }, {
            collection_name: "Two",
            url_slug: "two",
            collection_type: "group-one",
            id: 700002
        }, {
            collection_name: "Three",
            url_slug: "three",
            collection_type: "group-one",
            id: 700003
        }, {
            collection_name: "Four",
            url_slug: "four",
            collection_type: "group-one",
            id: 700004
        }, {
            collection_name: "Five",
            url_slug: "five",
            collection_type: "group-one",
            id: 700005
        }, {
            collection_name: "Six",
            url_slug: "six",
            collection_type: "group-one",
            id: 700006
        }, {
            collection_name: "Seven",
            url_slug: "seven",
            collection_type: "group-two",
            id: 700007
        }, {
            collection_name: "Eight",
            url_slug: "eight",
            collection_type: "group-three",
            id: 700008
        }, {
            collection_name: "Nine",
            url_slug: "nine",
            collection_type: "group-three",
            id: 700009
        }, {
            collection_name: "Ten",
            url_slug: "ten",
            collection_type: "group-four",
            id: 700010
        }
    ]
}

...我需要使用collection_type值作为每个新集合的关键字来获取该数据并创建一组新的集合：

{
    "group-one": [
        {
            collection_name: "One",
            url_slug: "one",
            id: 700001
        }, {
            collection_name: "Two",
            url_slug: "two",
            id: 700002
        }, {
            collection_name: "Three",
            url_slug: "three",
            id: 700003
        }, {
            collection_name: "Four",
            url_slug: "four",
            id: 700004
        }, {
            collection_name: "Five",
            url_slug: "five",
            id: 700005
        }, {
            collection_name: "Six",
            url_slug: "six",
            id: 700006
        }
    ],
    "group-two": [
        {
            collection_name: "Seven",
            url_slug: "seven",
            id: 700007
        }
    ],
    "group-three": [
        {
            collection_name: "Eight",
            url_slug: "eight",
            id: 700008
        }, {
            collection_name: "Nine",
            url_slug: "nine",
            id: 700009
        }
    ],
    "group-four": [
            {
            collection_name: "Ten",
            url_slug: "ten",
            id: 700010
        }
    ]
}

除了创建一个新对象，循环原始对象并将条目推送到该新对象中的键之外，还有一种更简单，更简洁的方法 - 可能使用Lodash - 来敲除它吗？

Answer 1

使用原生Array#forEach的可能解决方案。

const data = {"collections":[{"collection_name":"One","url_slug":"one","collection_type":"group-one","id":700001},{"collection_name":"Two","url_slug":"two","collection_type":"group-one","id":700002},{"collection_name":"Three","url_slug":"three","collection_type":"group-one","id":700003},{"collection_name":"Four","url_slug":"four","collection_type":"group-one","id":700004},{"collection_name":"Five","url_slug":"five","collection_type":"group-one","id":700005},{"collection_name":"Six","url_slug":"six","collection_type":"group-one","id":700006},{"collection_name":"Seven","url_slug":"seven","collection_type":"group-two","id":700007},{"collection_name":"Eight","url_slug":"eight","collection_type":"group-three","id":700008},{"collection_name":"Nine","url_slug":"nine","collection_type":"group-three","id":700009},{"collection_name":"Ten","url_slug":"ten","collection_type":"group-four","id":700010}]};
const obj = {};

data.collections.forEach(({ collection_type, ...z }) => {
  (obj[collection_type] || (obj[collection_type] = [])).push({
    ...z,
  });
})

console.log(obj);

或Array#reduce。

const data = {"collections":[{"collection_name":"One","url_slug":"one","collection_type":"group-one","id":700001},{"collection_name":"Two","url_slug":"two","collection_type":"group-one","id":700002},{"collection_name":"Three","url_slug":"three","collection_type":"group-one","id":700003},{"collection_name":"Four","url_slug":"four","collection_type":"group-one","id":700004},{"collection_name":"Five","url_slug":"five","collection_type":"group-one","id":700005},{"collection_name":"Six","url_slug":"six","collection_type":"group-one","id":700006},{"collection_name":"Seven","url_slug":"seven","collection_type":"group-two","id":700007},{"collection_name":"Eight","url_slug":"eight","collection_type":"group-three","id":700008},{"collection_name":"Nine","url_slug":"nine","collection_type":"group-three","id":700009},{"collection_name":"Ten","url_slug":"ten","collection_type":"group-four","id":700010}]};

const res = data.collections.reduce((s, { collection_type, ...z }) => {
  (s[collection_type] || (s[collection_type] = [])).push({
    ...z,
  });
  return s;
}, {})

console.log(res);

最后 - ES5解决方案（没有ES6功能）。

var data = {"collections":[{"collection_name":"One","url_slug":"one","collection_type":"group-one","id":700001},{"collection_name":"Two","url_slug":"two","collection_type":"group-one","id":700002},{"collection_name":"Three","url_slug":"three","collection_type":"group-one","id":700003},{"collection_name":"Four","url_slug":"four","collection_type":"group-one","id":700004},{"collection_name":"Five","url_slug":"five","collection_type":"group-one","id":700005},{"collection_name":"Six","url_slug":"six","collection_type":"group-one","id":700006},{"collection_name":"Seven","url_slug":"seven","collection_type":"group-two","id":700007},{"collection_name":"Eight","url_slug":"eight","collection_type":"group-three","id":700008},{"collection_name":"Nine","url_slug":"nine","collection_type":"group-three","id":700009},{"collection_name":"Ten","url_slug":"ten","collection_type":"group-four","id":700010}]};

var res = data.collections.reduce(function(s, a) {
  (s[a.collection_type] || (s[a.collection_type] = [])).push({
    id: a.id,
    collection_name: a.collection_name,
    url_slug: a.url_slug,
  });
  return s;
}, {})

console.log(res);

Answer 2

使用lodash，您可以尝试这样的事情：

var data = {collections: {...}};

var group = _(data.collections)
                .groupBy('collection_type')
                .forEach(function(records, groupName) {
                   // clean up/modify records
                   records.forEach(function(record) { 
                     delete record['collection_type']; 
                   });
                 });

run on JSFiddle

P.S。较早的lodash版本可能需要.value()

链末尾的_(...).groupBy().forEach().value()

将集合中的数据以一种格式分组到另一种格式中

2 个答案: