展平嵌套的对象数组，将键重命名为迭代器 [英] Flatten nested array of objects, renaming keys to an iterator

问题描述

我有一个对象数组，每个对象如下所示（轮询响应）：

I have an array of objects, with each object looking like the following (a poll response):

{
"slug": "18-AZ-Gov-GE-DvF",
"name": "2018 Arizona Gubernatorial GE",
"tags": [],
"charts": [],
"election_date": "2018-11-06",
"n_polls": 1,
"created_at": "2017-06-13T13:32:26.000Z",
"responses": [
 {
 "label": "Ducey",
 "name": "Doug Ducey",
 "party": "Republican",
 "incumbent": true
 },
 {
 "label": "Farley",
 "name": "Steve Farley",
 "party": "Democrat",
 "incumbent": false
 },
 {
 "label": "Other",
 "name": "Other",
 "party": null,
 "incumbent": false
 },
 {
 "label": "Undecided",
 "name": "Undecided",
 "party": null,
  "incumbent": false
 }
]
},

我需要展平通过 response 键访问的数组，以便每个对象锁定为其迭代器。

I need to flatten the array accessed by the responses key so that each object keyed to its iterator.

最终对象应类似于：

{
"slug": "18-AZ-Gov-GE-DvF",
"name": "2018 Arizona Gubernatorial GE",
"tags": [],
"charts": [],
"election_date": "2018-11-06",
"n_polls": 1,
"created_at": "2017-06-13T13:32:26.000Z",
 "label1": "Ducey",
 "name1": "Doug Ducey",
 "party1": "Republican",
 "incumbent1": true
 "label2": "Farley",
 "name2": "Steve Farley",
 "party2": "Democrat",
 "incumbent2": false
 "label3": "Other",
 "name3": "Other",
 "party3": null,
 "incumbent3": false
 "label4": "Undecided",
 "name4": "Undecided",
 "party4": null,
  "incumbent4": false
},

我见过的答案在展平或在集合上执行时不会重命名对象键。

The answers I've seen do not rename the object keys when flattening or are performed on a collection.

我已经尝试了几种解决方案，但想在真正投入使用之前先看看是否有简单的es6方法。

I've tried several solutions, but wanted to see if there's an easy es6 way before I really dive in.

推荐答案

一种方法将使用一些较新的功能，包括 价差 ， 销毁任务 ， 模板文字 ， 条目 ，最重要的是 reduce 。

One approach would use a few of the newer goodies including spread, destructuring assignment, template literals, entries and most importantly reduce.

主要要点是使用减速器转换响应数组到一个新对象，每个元素对象都使用辅助约简器来修改带有迭代器计数的键，并使用新键将值分配给外部对象。

The main gist is using a reducer to convert the responses array to a new object with each element object using a secondary reducer to amend the key with the iterator count and assigning the value to the outer object with the new key.

此方法的一个主要好处是原始对象（包括其子对象）没有被修改（读取：无副作用）。

A key benefit of this approach is the original object (including its sub-objects) are not modified (read: no side-effects).

const flattened = responses.reduce((o, g, i) => {
    Object.entries(g).reduce((t, [k, v]) => {
      t[`${k}${i + 1}`] = v;
      return t;
    }, o);

    return o;
  },
  {});

完整的示例：

const orig = {
  "slug": "18-AZ-Gov-GE-DvF",
  "name": "2018 Arizona Gubernatorial GE",
  "tags": [],
  "charts": [],
  "election_date": "2018-11-06",
  "n_polls": 1,
  "created_at": "2017-06-13T13:32:26.000Z",
  "responses": [{
      "label": "Ducey",
      "name": "Doug Ducey",
      "party": "Republican",
      "incumbent": true
    },
    {
      "label": "Farley",
      "name": "Steve Farley",
      "party": "Democrat",
      "incumbent": false
    },
    {
      "label": "Other",
      "name": "Other",
      "party": null,
      "incumbent": false
    },
    {
      "label": "Undecided",
      "name": "Undecided",
      "party": null,
      "incumbent": false
    }
  ]
};

const {responses, ...foo} = orig;
const flattened = responses.reduce((o, g, i) => {
    Object.entries(g).reduce((t, [k, v]) => {
      t[`${k}${i + 1}`] = v;
      return t;
    }, o);

    return o;
  },
  {});

console.log({flattened: {...foo, ...flattened}});
console.log({orig});

这篇关于展平嵌套的对象数组，将键重命名为迭代器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！