Лодаш групповой алфавит

Question

Я работаю над объектами, которые содержат некоторые пользовательские данные, и мне нужно преобразовать этот объект в другой объект для создания приложения контакта.Я использую Lodash для работы с массивами и объектами.

[
    {
      "id": 1,
      "first_name": "Alie",
      "last_name": "Stigger",
      "email": "astigger0@lulu.com",
      "gender": "Female",
      "avatar":
        "https://robohash.org/sintnihiladipisci.jpg?size=200x200&set=set1",
      "phone_number": "617-845-6906"
    },
    {
      "id": 2,
      "first_name": "Kendall",
      "last_name": "Mayes",
      "email": "kmayes1@bbb.org",
      "gender": "Male",
      "avatar": "https://robohash.org/nemoetqui.jpg?size=200x200&set=set1",
      "phone_number": "193-270-2893"
    },
    {
      "id": 3,
      "first_name": "Yolanthe",
      "last_name": "Maddaford",
      "email": "ymaddaford2@reference.com",
      "gender": "Female",
      "avatar":
        "https://robohash.org/exercitationemestaccusamus.jpg?size=200x200&set=set1",
      "phone_number": "267-365-2165"
    }
]

Теперь все, что мне нужно, - это построить еще один объект из основного, который содержит буквы алфавита на основе свойства last_name, используя Lodash.

В этом случае:

[
    {
      letter: "S",
      contacts: [
        {
          id: 1,
          first_name: "Alie",
          last_name: "Stigger",
          email: "astigger0@lulu.com",
          gender: "Female",
          avatar:
            "https://robohash.org/sintnihiladipisci.jpg?size=200x200&set=set1",
          phone_number: "617-845-6906"
        }
      ]
    },
    {
      letter: "M",
      contacts: [
        {
          id: 2,
          first_name: "Kendall",
          last_name: "Mayes",
          email: "kmayes1@bbb.org",
          gender: "Male",
          avatar: "https://robohash.org/nemoetqui.jpg?size=200x200&set=set1",
          phone_number: "193-270-2893"
        },
        {
          id: 3,
          first_name: "Yolanthe",
          last_name: "Maddaford",
          email: "ymaddaford2@reference.com",
          gender: "Female",
          avatar:
            "https://robohash.org/exercitationemestaccusamus.jpg?size=200x200&set=set1",
          phone_number: "267-365-2165"
        }
      ]
    }
  ]

Answer 1

Вы можете использовать lodash#groupBy, чтобы сгруппировать каждый элемент по первой букве last_name и lodash#map, чтобы преобразовать сгруппированный объект в преобразованный массив.

var result = _(data)
  .groupBy('last_name[0]')
  .map((contacts, letter) => ({ letter, contacts }))
  .value();

var data = [
    {
      "id": 1,
      "first_name": "Alie",
      "last_name": "Stigger",
      "email": "astigger0@lulu.com",
      "gender": "Female",
      "avatar":
        "https://robohash.org/sintnihiladipisci.jpg?size=200x200&set=set1",
      "phone_number": "617-845-6906"
    },
    {
      "id": 2,
      "first_name": "Kendall",
      "last_name": "Mayes",
      "email": "kmayes1@bbb.org",
      "gender": "Male",
      "avatar": "https://robohash.org/nemoetqui.jpg?size=200x200&set=set1",
      "phone_number": "193-270-2893"
    },
    {
      "id": 3,
      "first_name": "Yolanthe",
      "last_name": "Maddaford",
      "email": "ymaddaford2@reference.com",
      "gender": "Female",
      "avatar":
        "https://robohash.org/exercitationemestaccusamus.jpg?size=200x200&set=set1",
      "phone_number": "267-365-2165"
    }
];

var result = _(data)
  .groupBy('last_name[0]')
  .map((contacts, letter) => ({ letter, contacts }))
  .value();
  
console.log(result);

.as-console-wrapper{min-height:100%;top:0}

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

Answer 2

Вы можете сгруппировать по значению в верхнем регистре и затем отобразить результат.

var data = [{ id: 1, first_name: "Alie", last_name: "Stigger", email: "astigger0@lulu.com", gender: "Female", avatar: "https://robohash.org/sintnihiladipisci.jpg?size=200x200&set=set1", phone_number: "617-845-6906" }, { id: 2, first_name: "Kendall", last_name: "Mayes", email: "kmayes1@bbb.org", gender: "Male", avatar: "https://robohash.org/nemoetqui.jpg?size=200x200&set=set1", phone_number: "193-270-2893" }, { id: 3, first_name: "Yolanthe", last_name: "Maddaford", email: "ymaddaford2@reference.com", gender: "Female", avatar: "https://robohash.org/exercitationemestaccusamus.jpg?size=200x200&set=set1", phone_number: "267-365-2165" }],
    result = _(data)
        .groupBy(o => o.last_name[0].toUpperCase())
        .map((contacts, letter) => ({ letter, contacts }))
        .value();

    console.log(result);

.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>

Answer 3

Вы можете сгруппировать с reduce довольно легко, нет необходимости в библиотеке, просто выберите last_name, нажмите на массив в объекте, проиндексированном по первой букве, и получите значения объекта:

const input=[{"id":1,"first_name":"Alie","last_name":"Stigger","email":"astigger0@lulu.com","gender":"Female","avatar":"https://robohash.org/sintnihiladipisci.jpg?size=200x200&set=set1","phone_number":"617-845-6906"},{"id":2,"first_name":"Kendall","last_name":"Mayes","email":"kmayes1@bbb.org","gender":"Male","avatar":"https://robohash.org/nemoetqui.jpg?size=200x200&set=set1","phone_number":"193-270-2893"},{"id":3,"first_name":"Yolanthe","last_name":"Maddaford","email":"ymaddaford2@reference.com","gender":"Female","avatar":"https://robohash.org/exercitationemestaccusamus.jpg?size=200x200&set=set1","phone_number":"267-365-2165"}]

const output = Object.values(
  input.reduce((a, item) => {
    const letter = item.last_name[0];
    if (!a[letter]) a[letter] = [];
    a[letter].push(item);
    return a;
  }, {})
);
console.log(output);