Возврат единственного дочернего элемента с родительским элементом в массиве

Question

Вот что я пытаюсь сделать:

Я хочу просмотреть позиции пользователей, а затем использовать их для циклического перебора офисов, которым назначены должности, и возврата только офиса иположение пользователя.

Это то, что я пробовал, я знаю, что это избыточно и просто проходит через все офисы и фильтрует его по позициям пользователей и возвращает тот же точный результат, что и userPositions, я просто не могу понятькак пройти через них, захватить позицию в офисе и вернуть только те офисы и офисные позиции, у которых есть свой идентификатор == user позиции.id

    filter(){
      var userPositions = this.users.positions;
      var offices = this.offices;
      var filter = []
      var position = offices.forEach(office => {
        office.positions.forEach(position => {
          filter.push(position)
        })
      });
      userPositions.forEach(userP => {
        filter.find(p => p.id === userP.id)
      })
      console.log(filter)
    }

Вот как я хочу, чтобы это выглядело:

[
    {
        "id": 1,
        "name": "Leadership Committee",
        "abbreviation": "LC",
        "positions": [
            {
                "id": 122,
                "name": "Deputy Director",
                "abbreviation": "DD",
            },
        ]
    },
    {
        "id": 10,
        "name": "Admin Committee",
        "abbreviation": "AC",
        "positions": [
            {
                "id": 124,
                "name": "Director",
                "abbreviation": "Dir",
            }
        ]
    }
]

Вот информация о user.positions:

{
    "id": 1,
    "username": "Admin",
    "status": 1,
    "created_at": "2019-07-23 21:49:56",
    "updated_at": "2019-08-30 07:22:17",
    "positions": [
        {
            "id": 124,
            "name": "Director",
            "abbreviation": "Dir",
        },
        {
            "id": 122,
            "name": "Deputy Director",
            "abbreviation": "DD",
        }
    ]
}

и вот как выглядят все офисы:

[
    {
        "id": 1,
        "name": "Leadership Comittee",
        "abbreviation": "LC",
        "positions": [
            {
                "id": 119,
                "name": "Director",
                "abbreviation": "Dir",
                "pivot": {
                    "office": 1,
                    "position": 119,
                    "hierarchy": 1
                }
            },
            {
                "id": 122,
                "name": "Deputy Director",
                "abbreviation": "DD",
                "pivot": {
                    "office": 1,
                    "position": 122,
                    "hierarchy": 2
                }
            },
        ]
    },
    {
        "id": 10,
        "name": "Admin Comittee",
        "abbreviation": "AC",
        "positions": [
            {
                "id": 124,
                "name": "Director",
                "abbreviation": "Dir",
                "pivot": {
                    "office": 10,
                    "position": 124,
                    "hierarchy": 0
                }
            }
        ]
    }
]

Answer 1

Упрощенная формулировка проблемы.

При наличии 2 массивов источника, скажем, source1 и source2, возвращаются все элементы массива source2, которые относятся к определенному полю в source1.

Отношение: поле в source1 должно соответствовать одному элементу поля вложенного массива в source2

Ограничение : элементы в массиве source2 должны быть изменены перед возвратом в соответствии с соотношением выше

Уровень 1: Перебрать все элементы source1 (user.positions в вашем случае). Здесь я использовал Array.prototype.reduce для начала, потому что мой окончательный возвращаемый массив мог бы быть меньше, чем массив source1, если бы я не смог найти связанный элемент в source2. В вашем случае ни в одном офисе не найдено ни одной позиции.

Уровень 2: Внутри функции Array.prototype.reduce для каждого элемента source1 (каждая пользовательская позиция в вашем случае) возвращаетсясоответствующий элемент в массиве source2. В этом случае я использовал функцию Array.prototype.map, потому что ограничение говорит, что элементы в массиве source2 должны быть изменены.

Уровень 3: Внутри Array.prototype.map Функция, изменить каждый элемент source2 (каждый офис в этом случае). Я применяю отношение внутри функции карты, чтобы изменить каждый элемент в source2 (в каждом офисе). В вашем случае я изменяю свойство позиций каждого офиса, применяя функцию Array.prototype.filter к массиву позиций офиса с объектом позиции пользователя.

Фильтр может выдавать пустой массив или подмассив массива позиций офисакоторый используется для замены самого исходного массива офисных позиций. Каждый отфильтрованный объект также можно изменить с помощью функции карты, чтобы удалить некоторые ненужные поля. В вашем случае я удалил сводку из каждого объекта положения офиса.

Уровень 4: Удалите все измененные source2 объекты, свойство положений которых является пустым массивом.

Соберите все вместе ...

var data = {
  users: {
    id: 1,
    username: "Admin",
    status: 1,
    created_at: "2019-07-23 21:49:56",
    updated_at: "2019-08-30 07:22:17",
    positions: [
      {
        id: 124,
        name: "Director",
        abbreviation: "Dir"
      },
      {
        id: 122,
        name: "Deputy Director",
        abbreviation: "DD"
      }
    ]
  },
  offices: [
    {
      id: 1,
      name: "Leadership Comittee",
      abbreviation: "LC",
      positions: [
        {
          id: 119,
          name: "Director",
          abbreviation: "Dir",
          pivot: {
            office: 1,
            position: 119,
            hierarchy: 1
          }
        },
        {
          id: 122,
          name: "Deputy Director",
          abbreviation: "DD",
          pivot: {
            office: 1,
            position: 122,
            hierarchy: 2
          }
        }
      ]
    },
    {
      id: 10,
      name: "Admin Comittee",
      abbreviation: "AC",
      positions: [
        {
          id: 124,
          name: "Director",
          abbreviation: "Dir",
          pivot: {
            office: 10,
            position: 124,
            hierarchy: 0
          }
        }
      ]
    }
  ],
  filter() {
    return this.users.positions.reduce((acc, userPosition) => {
        acc = [
          ...acc,
          ...this.offices
            .map(office => {
              return {
                ...office,
                positions: office.positions
                  .filter(
                    officePosition => officePosition.id === userPosition.id
                  )
                  .map(({ pivot, ...rest }) => rest)
              };
            })
            .filter(office => office.positions.length > 0)
        ];
      return acc;
    }, []);
  }
};

console.log(data.filter());