Умный способ преобразовать имя свойства дочерних объектов, в массив строк?

Question

У меня есть объект, похожий на этот:

{
    "name":"sdfsd",
    "id":1,
    "groups":[
        {
            "name":"name1",
            "id":1,
            "subGroups":[..]
        },
        {
            "name":"name2",
            "id":21,
            "subGroups":[..]
        }
    ]
}

Я хочу массив со следующим:

[
   {
      "name":"name1",
      "id":1
   },
   {
      "name":"name2",
      "id":21
   }
]

Я мог бы просто сделать цикл и создать свой массив, но тамдолжен быть более красивый способ в ES6?

Answer 1

чистый путь ES6:

let groups = this.obj['groups'].map( ({id, name}) => ({ id, name }) );

или вы можете сделать его еще чище с spread:

let groups = this.obj['groups'].map( ({subGroups, ...groups}) => (groups) );

Answer 2

Вы можете написать:

const groups = this.obj.groups.map( ({name, id}) => ({name, id}) );

Или инкапсулировать маппер в отдельную функцию, подобную этой:

const getNameId = ({name, id}) => ({name, id});
const groups = this.obj.groups.map(getNameId);

Таким образом, здесь вы используете множество функций ES6:

• функция map () - введена до ES6, но очень функциональный способ для отображения существующего массива и создания нового неизменяемого (глубокое копирование, без ссылки на исходный массив)
• деструктурирование объектов как функциипараметры -> ({name, id}) => читать об этом - это круто.
• сокращенная запись объекта -> => ({name, id})
• запись без точки - еще одна особенность, которой пользуется энтузиаст функционального программирования - вы можете использовать ее с функциями unary - функциями только с одним параметром, такжеВызывается как arity из 1. Таким образом, когда вы пишете groups.map(g => ({id: g.id, name: g.name})), вы извлекаете функцию отображения в отдельную функцию, а затем передаете ее следующим образом: map(getNameId).

Answer 3

Использование .map() метода массива:

const groups = myObject.groups.map(g => ({ name : g.name, id : g.id }) );