将对象属性值分配为另一个对象属性

Question

我有以下 JavaScript 代码

const data = {
  columnFields: {
    columnField1: 'FieldValue1',
    columnField2: 'FieldValue2',
    columnField3: 'FieldValue3',
  },

  dataSets: [
    {
      columnProp1: 'value1',
      columnProp2: 'value2',
      columnProp3: 'value3',
    },
    {
      columnProp1: 'value11',
      columnProp2: 'value22',
      columnProp3: 'value33',
    },
  ],
};

我想查看此数据的输出：

const expectedOutput = [
  {
    FieldValue1: 'value1',
    FieldValue2: 'value2',
    FieldValue3: 'value3',
  },
  {
    FieldValue1: 'value11',
    FieldValue2: 'value22',
    FieldValue3: 'value33',
  },
];

我尝试了以下解决方案

function processData() {
  const processDataSet = [];
  const obj = {};
  data.dataSets.forEach((item) => {
    for (const key in item) {
      const element = item[key];
      for (const prop in data.columnFields) {
        obj[data.columnFields[props]] = element;
      }
    }
    processDataSet.push(obj);
  });

  return processDataSet;
}

这给了我不是我想要的输出

const output = [
  {
    FieldValue1: 'value33',
    FieldValue2: 'value33',
    FieldValue3: 'value33',
  },
  {
    FieldValue1: 'value33',
    FieldValue2: 'value33',
    FieldValue3: 'value33',
  },
];

这是预期的，因为每次它都会覆盖该值并以最后一个值结束。请帮助我指导代码，通过它我可以同时在循环中分配单个值。

Answer 1

在 columnFields 上使用 Object#values，您可以获得要在生成的对象数组中使用的键列表
使用Array#map，遍历dataSets
在每次迭代中，使用Object#values获取当前对象的值列表。使用 Array#reduce，迭代后者以创建一个对象，该对象具有首先计算的键和当前值

const data = {
  columnFields: { columnField1: 'FieldValue1', columnField2: 'FieldValue2', columnField3: 'FieldValue3' },
  dataSets: [
    { columnProp1: 'value1', columnProp2: 'value2', columnProp3: 'value3' },
    { columnProp1: 'value11', columnProp2: 'value22', columnProp3: 'value33' }
  ]
};

const { columnFields, dataSets } = data;
const keys = Object.values(columnFields);
const res = dataSets.map(e => 
  Object.values(e).reduce((acc, value, index) => ({
    ...acc,
    [keys[index]]: value
  }), {})
);

console.log(res);

将对象属性值分配为另一个对象属性

Assign an object property value as a another object property

javascript

arrays

object

for-in-loop

将对象 属性 值分配为另一个对象 属性

Assign an object property value as a another object property

javascript

arrays

object

for-in-loop

将对象属性值分配为另一个对象属性