在javascript中将嵌套数组转换为对象

Question

我正在处理一项涉及将数组转换为对象的任务，但我有点忙不过来。我们从一个数组开始，其中包含两个额外的嵌套数组，每个嵌套数组包含可变数量的数组（每个包含两个值）。

任务是将所有这些转换为一个数组，包含多个对象。在每个对象中，将有一系列键/值对，等于每个最小给定数组中的两个值。

例如

参数将如下所示：

[
  [['firstName', 'Joe'], ['lastName', 'Blow'], ['age', 42], ['role', 'clerk']],
  [['firstName', 'Mary'], ['lastName', 'Jenkins'], ['age', 36], ['role', 'manager']]
]

鉴于该输入，返回值应如下所示：

[{firstName: 'Joe', lastName: 'Blow', age: 42, role: 'clerk'}, {firstName: 'Mary', lastName: 'Jenkins', age: 36, role: 'manager'}]

使用调试器，我确定我的代码正确地将键/值对分配给 return 语句中的第一个对象。但是，当循环继续时，不是创建新的嵌套对象，而是替换第一个对象的键/值对，因此我只得到一个对象，该对象具有来自最终评估的数组的正确键值对。

到目前为止，这是我的代码：

function transformEmployeeData(employeeData) {
  var obj = {}, arr = []
  for (var i = 0; i < employeeData.length; i ++) {
    for (var j = 0; j < employeeData[i].length; j ++) {
      var key = employeeData[i][j][0];
      var value = employeeData[i][j][1];
      obj[key] = value;
    }
    arr.push(obj);
  }
  return arr;
}

这个让我的大脑有点纠结......任何建议将不胜感激！！！

Answer 1

问题的更新和单行解决方案：

const input = [
  [['firstName', 'Joe'], ['lastName', 'Blow'], ['age', 42], ['role', 'clerk']],
  [['firstName', 'Mary'], ['lastName', 'Jenkins'], ['age', 36], ['role', 'manager']]
]

const output = input.map(a => Object.fromEntries(a));

console.log(output);

Object.fromEntries() 已在 ECMAScript 2019 (ES10) 中引入

在撰写本文时（2019 年 4 月 11 日），该方法已经被 Chrome 73 和 Firefox 63 实现。很快它将被主要浏览器的新版本实现。从版本 7.4.0 (core-js@3) 开始，该方法也可以在 BabelJs 中使用。

Answer 2

除了在第一个循环内移动新对象的赋值之外，您可以考虑在函数顶部声明所有变量。

这就像一部戏剧中所有演员的介绍。

function transformEmployeeData(employeeData) {
  var obj,
      arr = [],
      i, j,
      key, value;

  for (i = 0; i < employeeData.length; i ++) {
    obj = {}
    for (j = 0; j < employeeData[i].length; j ++) {
      key = employeeData[i][j][0];
      value = employeeData[i][j][1];
      obj[key] = value;
    }
    arr.push(obj);
  }
  return arr;
}

var array = [[['firstName', 'Joe'], ['lastName', 'Blow'], ['age', 42], ['role', 'clerk']],[['firstName', 'Mary'], ['lastName', 'Jenkins'], ['age', 36], ['role', 'manager']]];

console.log(transformEmployeeData(array));

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

对于一个简短的解决方案，您可以使用一些 ES5/ES6 功能：

• Array#map 为每个元素重新调整一个新对象

• Object.assign 用于为对象分配更多属性，

• spread syntax ... 将数组作为参数，

• destructuring assignment，就像一个变压器和

• computed property names，是 Javascript 的一些伟大思想。 （我希望它也适用于变量。）

function transformEmployeeData(array) {
    return array.map(person => Object.assign(...person.map(([k, v]) => ({ [k]: v }))));
}

var array = [[['firstName', 'Joe'], ['lastName', 'Blow'], ['age', 42], ['role', 'clerk']],[['firstName', 'Mary'], ['lastName', 'Jenkins'], ['age', 36], ['role', 'manager']]];

console.log(transformEmployeeData(array));

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

Answer 3

您可以使用map 迭代主数组中的subarrays，然后使用reduce 将其子数组转换为对象属性。

var arr = [[['firstName', 'Joe'], ['lastName', 'Blow'], ['age', 42], ['role', 'clerk']], [['firstName', 'Mary'], ['lastName', 'Jenkins'], ['age', 36], ['role', 'manager']]];

var result = arr.map(function(subArr){
    return subArr.reduce(function(acc, data){
        acc[data[0]] = data[1];
        return acc;
    },{})
});

console.log(result);

Answer 4

将Array.prototype.map() 和Array.prototype.reduce() 与一些array destructuring 一起使用：

const result = data.map(entry => entry.reduce((a, [k, v]) => (a[k] = v, a), {}));

---

演示 sn-p：

const data = [[['firstName', 'Joe'], ['lastName', 'Blow'], ['age', 42], ['role', 'clerk']],
[['firstName', 'Mary'], ['lastName', 'Jenkins'], ['age', 36], ['role', 'manager']]];

const result = data.map(entry => entry.reduce((a, [k, v]) => (a[k] = v, a), {}));

console.log(result);

Answer 5

只要将Array#map与Array#reduce结合使用就很简单了。

let data = [
  [
    ['firstName', 'Joe'],
    ['lastName', 'Blow'],
    ['age', 42],
    ['role', 'clerk']
  ],
  [
    ['firstName', 'Mary'],
    ['lastName', 'Jenkins'],
    ['age', 36],
    ['role', 'manager']
  ]
];

let result = data.map(item => item.reduce((acc, [key, val]) => ({ ...acc, [key]: val }), {}));
console.log(result);

Answer 6

非常接近，您只需将obj = {} 放入外部for循环

function transformEmployeeData(employeeData) { 
   var arr = []
   for (var i = 0; i < employeeData.length; i ++) {
      var obj = {}; //observe this line
      for (var j = 0; j < employeeData[i].length; j ++) {
         var key = employeeData[i][j][0];
         var value = employeeData[i][j][1];
         obj[key] = value;
      }
      arr.push(obj);
   }
   return arr;
}

演示

var arr = [
  [
    ['firstName', 'Joe'],
    ['lastName', 'Blow'],
    ['age', 42],
    ['role', 'clerk']
  ],
  [
    ['firstName', 'Mary'],
    ['lastName', 'Jenkins'],
    ['age', 36],
    ['role', 'manager']
  ]
];

function transformEmployeeData(employeeData) {
  var arr = []
  for (var i = 0; i < employeeData.length; i++) {
    var obj = {};
    for (var j = 0; j < employeeData[i].length; j++) {
      var key = employeeData[i][j][0];
      var value = employeeData[i][j][1];
      obj[key] = value;
    }
    arr.push(obj);
  }
  return arr;
}

console.log( transformEmployeeData(arr) );

Answer 7

你可以使用Object.fromEnteries()ECMAScript 2019 (ES10)

var arr = [
  [['firstName', 'Joe'], ['lastName', 'Blow'], ['age', 42], ['role', 'clerk']],
  [['firstName', 'Mary'], ['lastName', 'Jenkins'], ['age', 36], ['role', 'manager']]
];

const object = arr.map(item => Object.fromEntries(item));

console.log(object);