javascript - 合并两个嵌套级别的对象数组并返回一个键对象数组

Question

我有一个名为 response 的对象数组，其中每个键都有一个值，现在我需要返回一个包含此键和值的数组，但需要从另一个包含键的标签名称的对象中获取标签。

键的标签名称是嵌套级别，在数据变量内。

如何获得如下所示的预期数据。需要从响应中选择 sectionType 并找到标签。

我需要通过合并响应和数据来获得 expectedData 变量结果。

    const response = [
  {
    sectionType: 'section1',
    test1: 'test 1 data',
    test2: '',
    test3: 'test 3 data',
  },
  {
    sectionType: 'section3',
    test1: 'test 1 data',
    test2: 'test 2 data',
    test4: 'test 4 data',
  },
  {
    sectionType: 'section2',
    test1: 'test 1 data',
    test2: 'test 2 data',
    test5: 'test 5 data',
  },
  {
    sectionType: 'section1',
    test1: 'test 1 data',
    test6: '',
    test3: 'test 3 data',
  },
  {
    sectionType: 'section3',
    test1: '',
    test2: 'test 2 data',
    test3: 'test 3 data',
  },
];

const data = {
  section1: {
    forms: [
      {
        fields: [
          {
            columnName: 'test1',
            label: [{ actualLabel: 'Test 1' }],
          },
          {
            columnName: 'test2',
            label: [{ actualLabel: 'Test 2' }],
          },
          {
            columnName: 'test0',
            label: [{ actualLabel: 'Test 0' }],
          },
        ],
      },
      {
        fields: [
          {
            columnName: 'test6',
            label: [{ actualLabel: 'Test 6' }],
          },
          {
            columnName: 'test3',
            label: [{ actualLabel: 'Test 3' }],
          },
          {
            columnName: 'test10',
            label: [{ actualLabel: 'Test 10' }],
          },
        ],
      },
      {
        fields: [
          {
            columnName: 'test15',
            label: [{ actualLabel: 'Test 15' }],
          },
          {
            columnName: 'test',
            label: [{ actualLabel: 'Test 6' }],
          },
          {
            columnName: 'test7',
            label: [{ actualLabel: 'Test 7' }],
          },
        ],
      },
    ],
  },
  section2: {
    forms: [
      {
        fields: [
          {
            columnName: 'test1',
            label: [{ actualLabel: 'Test 1' }],
          },
          {
            columnName: 'test2',
            label: [{ actualLabel: 'Test 2' }],
          },
          {
            columnName: 'test0',
            label: [{ actualLabel: 'Test 0' }],
          },
        ],
      },
      {
        fields: [
          {
            columnName: 'test3',
            label: [{ actualLabel: 'Test 3' }],
          },
          {
            columnName: 'test4',
            label: [{ actualLabel: 'Test 4' }],
          },
          {
            columnName: 'test10',
            label: [{ actualLabel: 'Test 10' }],
          },
        ],
      },
      {
        fields: [
          {
            columnName: 'test5',
            label: [{ actualLabel: 'Test 5' }],
          },
          {
            columnName: 'test6',
            label: [{ actualLabel: 'Test 6' }],
          },
          {
            columnName: 'test7',
            label: [{ actualLabel: 'Test 7' }],
          },
        ],
      },
    ],
  },
  section3: {
    forms: [
      {
        fields: [
          {
            columnName: 'test1',
            label: [{ actualLabel: 'Test 1' }],
          },
          {
            columnName: 'test2',
            label: [{ actualLabel: 'Test 2' }],
          },
          {
            columnName: 'test0',
            label: [{ actualLabel: 'Test 0' }],
          },
        ],
      },
      {
        fields: [
          {
            columnName: 'test3',
            label: [{ actualLabel: 'Test 3' }],
          },
          {
            columnName: 'test 4',
            label: [{ actualLabel: 'Test 4' }],
          },
          {
            columnName: 'test10',
            label: [{ actualLabel: 'Test 10' }],
          },
        ],
      },
      {
        fields: [
          {
            columnName: 'test15',
            label: [{ actualLabel: 'Test 15' }],
          },
          {
            columnName: 'test6',
            label: [{ actualLabel: 'Test 6' }],
          },
          {
            columnName: 'test7',
            label: [{ actualLabel: 'Test 7' }],
          },
        ],
      },
    ],
  },
};

let expectedData = [
  {
    test1: { value: 'test 1 data', label: 'Test 1' },
    test2: { value: '', label: 'Test 2' },
    test3: { value: 'test 3 data', label: 'Test 3' },
  },
  {
    test1: { value: 'test 1 data', label: 'Test 1' },
    test2: { value: 'test 2 data', label: 'Test 2' },
    test4: { value: 'test 4 data', label: 'Test 4' },
  },
  {
    test1: { value: 'test 1 data', label: 'Test 1' },
    test2: { value: 'test 2 data', label: 'Test 2' },
    test5: { value: 'test 5 data', label: 'Test 5' },
  },
  {
    test1: { value: 'test 1 data', label: 'Test 1' },
    test6: { value: '', label: 'Test 6' },
    test3: { value: 'test 3 data', label: 'Test 3' },
  },
  {
    test1: { value: '', label: 'Test 1' },
    test2: { value: 'test 2 data', label: 'Test 2' },
    test3: { value: 'test 3 data', label: 'Test 3' },
  },
];

我尝试使用下面的代码，但得到了对象但没有完全得到。有没有更好的方法来实现这一目标。

let keysCollection = []

response.forEach(d => {
  let keys = Object.keys(d);
  keysCollection.push(keys)
})


let mergingKeysCollection = keysCollection.reduce((a,b) => [...a, ...b], [])

let uniqueKeys = Array.from(new Set(mergingKeysCollection))

let actualData = Object.keys(data)

Answer 1

你可以拿一个Map对于标签并通过使用值和标签创建新对象来映射响应。

var response = [{ sectionType: 'section1', test1: 'test 1 data', test2: '', test3: 'test 3 data' }, { sectionType: 'section3', test1: 'test 1 data', test2: 'test 2 data', test4: 'test 4 data' }, { sectionType: 'section2', test1: 'test 1 data', test2: 'test 2 data', test5: 'test 5 data' }, { sectionType: 'section1', test1: 'test 1 data', test6: '', test3: 'test 3 data' }, { sectionType: 'section3', test1: '', test2: 'test 2 data', test3: 'test 3 data' }],
    data = { section1: { forms: [{ fields: [{ columnName: 'test1', label: [{ actualLabel: 'Test 1' }] }, { columnName: 'test2', label: [{ actualLabel: 'Test 2' }] }, { columnName: 'test0', label: [{ actualLabel: 'Test 0' }] }] }, { fields: [{ columnName: 'test6', label: [{ actualLabel: 'Test 6' }] }, { columnName: 'test3', label: [{ actualLabel: 'Test 3' }] }, { columnName: 'test10', label: [{ actualLabel: 'Test 10' }] }] }, { fields: [{ columnName: 'test15', label: [{ actualLabel: 'Test 15' }] }, { columnName: 'test', label: [{ actualLabel: 'Test 6' }] }, { columnName: 'test7', label: [{ actualLabel: 'Test 7' }] }] }] }, section2: { forms: [{ fields: [{ columnName: 'test1', label: [{ actualLabel: 'Test 1' }] }, { columnName: 'test2', label: [{ actualLabel: 'Test 2' }] }, { columnName: 'test0', label: [{ actualLabel: 'Test 0' }] }] }, { fields: [{ columnName: 'test3', label: [{ actualLabel: 'Test 3' }] }, { columnName: 'test4', label: [{ actualLabel: 'Test 4' }] }, { columnName: 'test10', label: [{ actualLabel: 'Test 10' }] }] }, { fields: [{ columnName: 'test5', label: [{ actualLabel: 'Test 5' }] }, { columnName: 'test6', label: [{ actualLabel: 'Test 6' }] }, { columnName: 'test7', label: [{ actualLabel: 'Test 7' }] }] }] }, section3: { forms: [{ fields: [{ columnName: 'test1', label: [{ actualLabel: 'Test 1' }] }, { columnName: 'test2', label: [{ actualLabel: 'Test 2' }] }, { columnName: 'test0', label: [{ actualLabel: 'Test 0' }] }] }, { fields: [{ columnName: 'test3', label: [{ actualLabel: 'Test 3' }] }, { columnName: 'test 4', label: [{ actualLabel: 'Test 4' }] }, { columnName: 'test10', label: [{ actualLabel: 'Test 10' }] }] }, { fields: [{ columnName: 'test15', label: [{ actualLabel: 'Test 15' }] }, { columnName: 'test6', label: [{ actualLabel: 'Test 6' }] }, { columnName: 'test7', label: [{ actualLabel: 'Test 7' }] }] }] } },
    labels = Object.entries(data).reduce((l, [k, { forms }]) => {
        forms.forEach(({ fields }) =>
            fields.forEach(({ columnName, label: { 0: { actualLabel } } }) =>
                l.set([k, columnName].join('|'), actualLabel)
            )
        );
        return l;
    }, new Map),
    result = response.map(({ sectionType, ...rest }) =>
        Object.assign({}, ...Object.entries(rest).map(([k, value]) =>
            ({ [k]: { value, label: labels.get([sectionType, k].join('|')) } }))
        )
    );

console.log(result);

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