对象值被循环上的最后一个值覆盖答案

【问题标题】：Object value being over written by last value on the Loop对象值被循环上的最后一个值覆盖
【发布时间】：2018-04-22 22:34:59
【问题描述】：

我有以下输入数据：

{
   'a': [1, 2, 3],
   'b': ['x', 'y', 'z'],
   'c': ['a', 'b', 'c'],
}

我正在尝试将上述输入数据更改为以下数据结构：

{ 
  '0': { a: 1, b: 'x', c: 'a' },
  '1': { a: 2, b: 'y', c: 'b' },
  '2': { a: 3, b: 'z', c: 'c' }
}

我的 Javascript 代码是：

let parentDataset = {
  'a': [1, 2, 3],
  'b': ['x', 'y', 'z'],
  'c': ['a', 'b', 'c'],
} 

let children = {};
let parent = {};

for (let key in parentDataset) {

  let i = 0;
  for (let value of parentDataset[key]) {        
    children[key] = value;
    parent[i] = children;
    i++;
  }
}

console.log('parent', parent);

但我得到以下输出，其中最后一个值覆盖了前两个值，如下所示：

{ 
  '0': { a: 3, b: 'z', c: 'c' },
  '1': { a: 3, b: 'z', c: 'c' },
  '2': { a: 3, b: 'z', c: 'c' }
}

任何解决方案和解释将不胜感激！

【问题讨论】：

在循环内声明子节点
不，它给出以下输出： parent { '0': { c: 'a' }, '1': { c: 'b' }, '2': { c: ' c' } }
所有三个 0 1 和 2 都存储相同的 children 对象。你需要一个新的。你必须重新组织一下循环。

标签： javascript object ecmascript-6

【解决方案1】：

const input = {
  'a': [1, 2, 3],
  'b': ['x', 'y', 'z'],
  'c': ['a', 'b', 'c']
};

const output = {};

Object.keys(input).forEach( key => {
  input[key].forEach((value,i) => {
    if( !output[i] ){
       output[i] = { [key] : value };
    } else {
       output[i][key] = value;
    }
 });
});

【讨论】：

【解决方案2】：

获取键列表后，可以将Array#reduce其中一个数组添加到一系列对象中，并使用Array#forEach和Object#assign填充它们：

const obj = {
   'a': [1, 2, 3],
   'b': ['x', 'y', 'z'],
   'c': ['a', 'b', 'c'],
};

const keys = Object.keys(obj);

const result = obj[keys[0]].reduce((r, _, i) => {
  const o = r[i] = {};
  
  keys.forEach((key) => Object.assign(o, { [key]: obj[key][i] }));

  return r;
}, {});

console.log(result);

这是您的代码的工作版本：

const parentDataset = {
  'a': [1, 2, 3],
  'b': ['x', 'y', 'z'],
  'c': ['a', 'b', 'c'],
} 

const parent = {};

for (const key in parentDataset) {
  let i = 0;
  
  for (const value of parentDataset[key]) {        
    !parent[i] && (parent[i] = {}); // create a new object if one is needed
    parent[i][key] = value; // add the key and value to the object
    i++;
  }
}

console.log('parent', parent);

【讨论】：

【解决方案3】：

另一个解决方案是减少对象的值。例如：

const data = {
  'a': [1, 2, 3],
  'b': ['x', 'y', 'z'],
  'c': ['a', 'b', 'c'],
}

const result = Object.values(data).reduce((acc, subarr, idx, arr) => {
  return { ...acc, [idx]: arr.map(sub => sub[idx]) }
}, {})

【讨论】：

【解决方案4】：

要实现这一点，您必须遍历给定的对象键和值。

下面是小代码-sn-p：

var data = {
  'a': [1, 2, 3],
  'b': ['x', 'y', 'z'],
  'c': ['a', 'b', 'c'],
};


function addKeys(keys, values, index) {
  var subObj = {}
  for (var i = 0; i < keys.length; i++) {
    subObj[keys[i]] = values[i][index]
  }
  return subObj
}

function returnFinalObject(data) {
  var keys = Object.keys(data)
  var values = Object.values(data)
  var obj = {}
  for (var i = 0; i < keys.length; i++) {
    obj[i] = addKeys(keys, values, i)
  }
  return (obj)
}

var finalObj = returnFinalObject(data)

console.log(finalObj)

希望对你有帮助

【讨论】：

【解决方案5】：

Array.prototype.reduce 两次：

var o = {
  'a': [1, 2, 3],
  'b': ['x', 'y', 'z'],
  'c': ['a', 'b', 'c'],
};

var transposed = Object.keys(o).reduce((res, key, i, arr) => {
  res[i] = arr.reduce((row, key) => {
    row[key] = o[key][i];
    return row;
  }, {});
  return res;
}, {});

console.log(transposed);

【讨论】：