Question

我想用名字的First char对JSON进行分组，但结果对象应该有两个属性“Key”＆amp; “数据”

我尝试使用lodash，它给了我部分预期结果但不是完整的。

以下是使用lodash实现的数据，预期结果，当前结果和当前代码的详细信息。

任何帮助将不胜感激。

JSON：

UserData = [  
        {  
         "gender":"male",
         "name":{
            "title":"mr",
            "first":"landon",
            "last":"gonzalez",
        },
         "location":{  
            "street":"7927 bollinger rd",
            "city":"madison",
            "state":"washington",
            "postcode":24642
         },
         "email":"landon.gonzalez@example.com",
         "dob":"1972-04-26 11:40:09",
         "registered":"2013-07-04 17:42:44",
         "phone":"(038)-931-4026",
         "cell":"(808)-824-5320",
         "nat":"US"
        },
        {  
         "gender":"male",
            "title":"mr",
            "first_name":"jonathan",
            "last_name":"petersen",
         "location":{  
            "street":"2583 brorsonsvej",
            "city":"brøndby strand",
            "state":"hovedstaden",
            "postcode":87814
         },
         "email":"jonathan.petersen@example.com",
         "dob":"1948-05-06 21:48:27",
         "registered":"2009-03-09 17:04:40",
         "phone":"03441612",
         "cell":"73824887",
         "nat":"DK"
      },
        {  
         "gender":"male",
         "name":{
            "title":"mr",
            "first":"roméo",
            "last":"marchand",
            },
         "location":{  
            "street":"9471 rue bony",
            "city":"créteil",
            "state":"maine-et-loire",
            "postcode":30698
         },
         "email":"roméo.marchand@example.com",
         "dob":"1969-08-18 16:41:01",
         "registered":"2015-04-21 19:26:04",
         "phone":"04-43-18-74-25",
         "cell":"06-83-89-77-72",
         "nat":"FR"
      }
    ]

预期：

[
{ key: 'A', data: [{...}, {...}, {...}] },
{ key: 'B', data: [{...}, {...}, {...}] },
{ key: 'C', data: [{...}, {...}, {...}] },
]

当前

[
{ 'A': [{...}, {...}, {...}] },
{ 'B': [{...}, {...}, {...}] },
{ 'C': [{...}, {...}, {...}] },
]

当前代码：

  sectionListData(users){
   let sectionedUsers = _.groupBy(users, function(user) {
        return user.first_name.charAt(0).toUpperCase();
    });
    alert(JSON.stringify(sectionedUsers));
  }

Answer 1

使用lodash.chain和grouping之后，map结果来创建您选择的对象：

＆＃13;

let UserData = [{
    "gender": "male",
    "name": {
      "title": "mr",
      "first": "landon",
      "last": "gonzalez",
    },
    "location": {
      "street": "7927 bollinger rd",
      "city": "madison",
      "state": "washington",
      "postcode": 24642
    },
    "email": "landon.gonzalez@example.com",
    "dob": "1972-04-26 11:40:09",
    "registered": "2013-07-04 17:42:44",
    "phone": "(038)-931-4026",
    "cell": "(808)-824-5320",
    "nat": "US"
  },
  {
    "gender": "male",
    "title": "mr",
    "first_name": "jonathan",
    "last_name": "petersen",
    "location": {
      "street": "2583 brorsonsvej",
      "city": "brøndby strand",
      "state": "hovedstaden",
      "postcode": 87814
    },
    "email": "jonathan.petersen@example.com",
    "dob": "1948-05-06 21:48:27",
    "registered": "2009-03-09 17:04:40",
    "phone": "03441612",
    "cell": "73824887",
    "nat": "DK"
  },
  {
    "gender": "male",
    "name": {
      "title": "mr",
      "first": "roméo",
      "last": "marchand",
    },
    "location": {
      "street": "9471 rue bony",
      "city": "créteil",
      "state": "maine-et-loire",
      "postcode": 30698
    },
    "email": "roméo.marchand@example.com",
    "dob": "1969-08-18 16:41:01",
    "registered": "2015-04-21 19:26:04",
    "phone": "04-43-18-74-25",
    "cell": "06-83-89-77-72",
    "nat": "FR"
  }
];

let sectionedUsers = _.chain(UserData)
  .groupBy(function(user) {
    let firstName = _.get(user, 'name.first') || user.first_name;
    return firstName.charAt(0).toUpperCase();
  })
  .map((data, key) => ({
    key,
    data
  }))
  .value();

console.log(sectionedUsers);

＆＃13;

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.5/lodash.min.js"></script>

＆＃13;

Answer 2

您可以_.map分组结果。

var userData = [{ gender: "male", name: { title: "mr", first: "landon", last: "gonzalez" }, location: { street: "7927 bollinger rd", city: "madison", state: "washington", postcode: 24642 }, email: "landon.gonzalez@example.com", dob: "1972-04-26 11:40:09", registered: "2013-07-04 17:42:44", phone: "(038)-931-4026", cell: "(808)-824-5320", nat: "US" }, { gender: "male", title: "mr", name: { first: "jonathan", last: "petersen" }, location: { street: "2583 brorsonsvej", city: "brøndby strand", state: "hovedstaden", postcode: 87814 }, email: "jonathan.petersen@example.com", dob: "1948-05-06 21:48:27", registered: "2009-03-09 17:04:40", phone: "03441612", cell: "73824887", nat: "DK" }, { gender: "male", name: { title: "mr", first: "roméo", last: "marchand" }, location: { street: "9471 rue bony", city: "créteil", state: "maine-et-loire", postcode: 30698 }, email: "roméo.marchand@example.com", dob: "1969-08-18 16:41:01", registered: "2015-04-21 19:26:04", phone: "04-43-18-74-25", cell: "06-83-89-77-72", nat: "FR" }];
 
let sectionedUsers = _(userData)
        .groupBy(user => user.name.first[0].toUpperCase())
        .map((data, key) => ({ key, data }))
        .value(); 

console.log(sectionedUsers);

.as-console-wrapper { max-height: 100% !important; top: 0; }

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.15.0/lodash.min.js"></script>

通过JSON响应中的第一个char对数据进行分组

2 个答案: