本文介绍了将json对象数组转换为另一个json对象的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个json对象数组,如下所示。

I have an array of json objects as shown below.

[
    {
      "wrappedItem": {
        "systemName": "jira",
        "domainObject": "issue",
        "eventType": "creation"
      },
      "id": 39,
      "enabled": true
    },
    {
      "wrappedItem": {
        "systemName": "jira",
        "domainObject": "issue",
        "eventType": "predeletion"
      },
      "id": 40,
      "enabled": true
    },
    {
      "wrappedItem": {
        "systemName": "jira",
        "domainObject": "issue",
        "eventType": "deletion"
      },
      "id": 41,
      "enabled": true
    },
    {
      "wrappedItem": {
        "systemName": "jira",
        "domainObject": "issue",
        "eventType": "update"
      },
      "id": 42,
      "enabled": true
    },
    {
      "wrappedItem": {
        "systemName": "jira",
        "domainObject": "recquirement",
        "eventType": "new"
      },
      "id": 43,
      "enabled": true
    },
    {
      "wrappedItem": {
        "systemName": "jira",
        "domainObject": "recquirement",
        "eventType": "old"
      },
      "id": 44,
      "enabled": true
    },
    {
      "wrappedItem": {
        "systemName": "bitbucket",
        "domainObject": "branch",
        "eventType": "creation"
      },
      "id": 45,
      "enabled": true
    },
    {
      "wrappedItem": {
        "systemName": "bitbucket",
        "domainObject": "branch",
        "eventType": "deletion"
      },
      "id": 46,
      "enabled": true
    },
    {
      "wrappedItem": {
        "systemName": "bitbucket",
        "domainObject": "pull-request",
        "eventType": "creation"
      },
      "id": 47,
      "enabled": true
    }
  ]

如果您仔细观察上面的数据,您可以看到数据可以根据 systemName 进行分组,然后是 domainObject ,然后是 eventType

If you closely observe the data above, you can see that the data can be grouped based on the systemName, followed by the domainObject, followed by eventType.

我想将数据显示为像时尚一样的树。为此,我决定使用第三方图书馆。它期望json对象以某种方式。 (请转到该链接以查看所需的json对象的结构)。

I want to display the data into a tree like fashion. For this, I have decided to use angular-ui-tree third party library. It expects the json object to be in a certain way. (Please go to that link to see the structure of the json object it needs).

我有一个要求,我必须将我的数据转换为 angular-ui-tree所需的结构这样我就可以将我的数据显示为树。

I have a requirement where I have to convert my data into a structure needed by the angular-ui-tree so that I can display my data as a tree.

最终,我期待json对象看起来像:

Eventually, I am expecting the json object to look like :

[
  {
    "systemName": "jira",
    "domains": [
      {
        "domainObject": "issue",
        "eventTypes": [
          {
            "eventType": "creation",
            "id": 39,
            "enabled": true
          },
          {
            "eventType": "pre-deletion",
            "id": 40,
            "enabled": true
          },
          {
            "eventType": "deletion",
            "id": 41,
            "enabled": true
          },
          {
            "eventType": "issue",
            "id": 42,
            "enabled": true
          }
        ]
      },
      {
        "domainObject": "requirement",
        "eventTypes": [
          {
            "eventType": "new",
            "id": 43,
            "enabled": true
          },
          {
            "eventType": "old",
            "id": 44,
            "enabled": true
          }
        ]
      }
    ]
  },
  {
    "systemName": "bitbucket",
    "domains": [
      {
        "domainObject": "branch",
        "eventTypes": [
          {
            "eventType": "creation",
            "id": 45,
            "enabled": true
          },
          {
            "eventType": "deletion",
            "id": 46,
            "enabled": true
          }
        ]
      },
      {
        "domainObject": "pull-request",
        "eventTypes": [
          {
            "eventType": "creation",
            "id": 47,
            "enabled": true
          }
        ]
      }
    ]
  }
]

尽可能看到这个数据按 systemName 分组,然后是 domainObject ,然后是 eventType
有人可以帮我转换上面显示的结构中的数据。

As you can see this data is grouped by systemName, followed by domainObject and followed by eventType.Can someone help me in converting my data in the structure shown above.

推荐答案

使用 reduce 散列对象及其子对象,然后使用 Object.keys map 将这些哈希对象转换为如下数组:

Use reduce to hash the object and their subobject, then use Object.keys with map to transform those hash object into an array like this:

function group(arr) {
    // PHASE 1: wrap the object and the sub-objects into hash objects (group them)
    var hash = arr.reduce(function(h, o) {                                // for each object o in the array arr
        var sn = o.wrappedItem.systemName;                                // get the systemName
        var dob = o.wrappedItem.domainObject;                             // get the domainObject
        var ev = {eventType: o.wrappedItem.eventType, id: o.id, enabled: o.enabled}; // create an eventType object
        if(h[sn]) {                                                       // if the systemName sn is already hashed
            if(h[sn].domainHash[dob])                                     // if the domain object dob is already hashed
                h[sn].domainHash[dob].eventTypes.push(ev);                // then push the eventType ev into its eventTypes array
            else                                                          // if not (the domain object is not hashed yet) then create a new domain object that have the eventType ev as the only item in its eventTypes array
                h[sn].domainHash[dob] = {domainObject: dob, eventTypes: [ev]};
        }
        else {                                                            // if not (the systemName sn is not hashed yet)
            h[sn] = {systemName: sn, domainHash: {}};                     // create a new systemName object with its domainHash object initialized with the domain object dob which is also initalized with the eventType ev
            h[sn].domainHash[dob] = {domainObject: dob, eventTypes: [ev]};
        }

        return h;
    }, {});

    // PHASE 2: unwrap the hash objects
    return Object.keys(hash).map(function(o) {                            // unwrap hash
        var domains = Object.keys(hash[o].domainHash).map(function(d) {   // unwrap domainHash
            return hash[o].domainHash[d];
        });
        delete hash[o].domainHash;                                        // remove the property domainHash
        hash[o].domains = domains;                                        // replace it with the property domains
        return hash[o];
    });
}

示例:

var array = [{"wrappedItem":{"systemName":"jira","domainObject":"issue","eventType":"creation"},"id":39,"enabled":true},{"wrappedItem":{"systemName":"jira","domainObject":"issue","eventType":"predeletion"},"id":40,"enabled":true},{"wrappedItem":{"systemName":"jira","domainObject":"issue","eventType":"deletion"},"id":41,"enabled":true},{"wrappedItem":{"systemName":"jira","domainObject":"issue","eventType":"update"},"id":42,"enabled":true},{"wrappedItem":{"systemName":"jira","domainObject":"recquirement","eventType":"new"},"id":43,"enabled":true},{"wrappedItem":{"systemName":"jira","domainObject":"recquirement","eventType":"old"},"id":44,"enabled":true},{"wrappedItem":{"systemName":"bitbucket","domainObject":"branch","eventType":"creation"},"id":45,"enabled":true},{"wrappedItem":{"systemName":"bitbucket","domainObject":"branch","eventType":"deletion"},"id":46,"enabled":true},{"wrappedItem":{"systemName":"bitbucket","domainObject":"pull-request","eventType":"creation"},"id":47,"enabled":true}];

function group(arr) {
    var hash = arr.reduce(function(h, o) {
        var sn = o.wrappedItem.systemName;
        var dob = o.wrappedItem.domainObject;
        var ev = {eventType: o.wrappedItem.eventType, id: o.id, enabled: o.enabled};
        if(h[sn]) {
            if(h[sn].domainHash[dob])
                h[sn].domainHash[dob].eventTypes.push(ev);
            else
                h[sn].domainHash[dob] = {domainObject: dob, eventTypes: [ev]};
        }
        else {
            h[sn] = {systemName: sn, domainHash: {}};
            h[sn].domainHash[dob] = {domainObject: dob, eventTypes: [ev]};
        }

        return h;
    }, {});

    return Object.keys(hash).map(function(o) {
        var domains = Object.keys(hash[o].domainHash).map(function(d) {
            return hash[o].domainHash[d];
        });
        delete hash[o].domainHash;
        hash[o].domains = domains;
        return hash[o];
    });
}


console.log(group(array));

说明:

之后第1阶段,我们得到一个这样的对象:

After phase 1, we get an object like this:

{
  "jira": {
    systemName: "jira",
    domainHash: {
      "issue": {
        domainObject: "issue",
        eventTypes: [...]
      },
      "other domain object": {
        domainObject: "other domain object",
        eventTypes: [...]
      },
      ...
    }
  },
  "other system name": {
    systemName: "other system name",
    domainHash: {
      "something": {
        domainObject: "something",
        eventTypes: [...]
      },
      ...
    }
  },
  ...
}

这不是您想要的输出,散列可以更容易地对项目进行分组,但输出将是一个对象。因此,要获得所需的结果(数组),您还需要将哈希对象的子对象映射到数组中。

Which is not the output you want, the hashing makes it easier to group items, but the output will be an object. So to get the desired result (an array), you'll have too map the sub-object of the hash object into an array.

var result = {
  hash["jira"],
  hash["other system name"],
  ...
];

不仅需要映射的systemName对象,还需要映射domainObject对象(对于每个systemName对象):

And not just the systemName objects that need mapping, the domainObject objects need to be mapped too (for each systemName object):

var domains = [
  domainHash["issue"],
  domainHash["other domain object"],
  ...
];

这篇关于将json对象数组转换为另一个json对象的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

08-20 20:45