javascript - 如何将一个对象属性值指定为另一个对象属性？

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

• 使用Object#values在columnFields上，您可以获得要在结果对象数组中使用的键列表
• 使用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);