logo标签列表

将JavaScript中的嵌套数组转换为对象

javascriptarraysobjectnested
4
我正在处理一个与将数组转换为对象相关的任务，但我有些束手无策。我们从一个包含两个额外嵌套数组的数组开始，每个嵌套数组都包含多个数组（每个数组由两个值组成）。
任务是将所有这些内容转换为一个数组，其中包含多个对象。在每个对象内部，将有一系列键/值对，等于最小给定数组中的两个值。
例如：
参数将像这样：
[
  [['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'}]

使用调试器，我已经确定我的代码正确地将键/值对分配给了返回语句中的第一个对象。然而，当循环继续时，它不是创建一个新的嵌套对象，而是替换第一个对象中的键/值对，因此我最终只得到一个包含来自最终评估的正确键值对的对象。

这是我目前的代码：

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;
}

这个问题让我的思维有些混乱...任何建议都将不胜感激!!!

7个回答
9

这是一个更新的，一行解决问题的解决方案:

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已经实现了这种方法。很快它将在各大浏览器的新版本中得到实现。此方法也自BabelJs 7.4.0版本（core-js@3）起可用。

6
除了在第一个循环内分配新对象的移动之外，您可以考虑在函数顶部声明所有变量，就像戏剧中所有演员的介绍一样。 

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功能：

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; }

1

非常接近，你只需要将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) );

1

使用 Array.prototype.map() 和 Array.prototype.reduce() 结合一些 数组解构：

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

演示代码片段：

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);

1
如果您只是使用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);

1
你可以使用map来迭代主数组中的子数组，然后使用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);

0

你可以使用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);

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接