繁体   English   中英

如何使用 JavaScript 从数据创建嵌套对象?

[英]How to create a nested object from data using JavaScript?

这是一个多行的对象:

  {
  "functions": [
    {
      "package_id": "2",
      "module_id": "2",
      "data_id": "2"
    },
    {
      "package_id": "1",
      "module_id": "1",
      "data_id": "2"
    },
    {
      "package_id": "2",
      "module_id": "3",
      "data_id": "3"
    }
  ]
}

想要的结果

我希望它返回到如下所示的“嵌套”对象中,没有重复:

{
  "packages": [
    {
      "package_id": "2",
      "modules": [
        {
          "module_id": "2",
          "data": [
            {
              "data_id": "2"
            }
          ]
        },
        {
          "module_id": "3",
          "data": [
            {
              "data_id": "3"
            }
          ]
        }
      ]
    },{
      "package_id": "1",
      "modules": [
        {
          "module_id": "1",
          "data": [
            {
              "data_id": "2"
            }
          ]
        }
      ]
    }
  ]
}

我已经在循环中尝试过循环,构造多个数组和对象。 这会导致重复或覆盖对象成为单个对象。 有没有更通用的方法来用 JavaScript 生成这个? (它用于 Angular (6) 项目。

示例 1

getFunctionPackage() {

        var fList = this.functionList;

        var dArr = [];
        var dObj = {};

        var pArr = [];
        var pObj = {};

        var mArr = [];
        var mObj = {};

        for (var key in fList) {

            pObj['package_id'] = fList[key]['package_id'];
            mObj['module_id'] = fList[key]['module_id'];
            dObj['data_id'] = fList[key]['data_id'];

            for (var i = 0; i < pArr.length; i++) {
                if (pArr[i].package_id != pObj['package_id']) {
                    pArr.push(pObj);
                }
                for (var x = 0; x < mArr.length; x++) {
                    if (pArr[i]['modules'][x].module_id != mObj['module_id']) {
                        mArr.push(mObj);
                    }
                    for (var y = 0; y < dArr.length; y++) {
                        if (pArr[i]['modules'][x]['datas'][y].data_id != dObj['data_id']) {
                            dArr.push(dObj);
                        }
                    }
                }
            }

            if (dArr.length == 0) {
                dArr.push(dObj);
            }
            mObj['datas'] = dArr;

            if (mArr.length == 0) {
                mArr.push(mObj);
            }
            pObj['modules'] = mArr;

            if (pArr.length == 0) {
                pArr.push(pObj);
            }
            dObj = {};
            mObj = {};
            pObj = {};
        }
    }

示例 2:导致跳过布尔值的原因

 var fList = this.functionList;

var dArr = [];
var dObj = {};

var pArr = [];
var pObj = {};

var mArr = [];
var mObj = {};

var rObj = {};

for (var key in fList) {

    pObj['package_id'] = fList[key]['package_id'];
    mObj['module_id'] = fList[key]['module_id'];
    dObj['data_id'] = fList[key]['data_id'];

    var pfound = false;
    var mfound = false;
    var dfound = false;
    
    for (var i = 0; i < pArr.length; i++) {
        if (pArr[i].package_id == pObj['package_id']) {
            for (var x = 0; x < mArr.length; x++) {
                if (pArr[i]['modules'][x].module_id == mObj['module_id']) {
                    for (var y = 0; y < dArr.length; y++) {
                        if (pArr[i]['modules'][x]['datas'][y].data_id == dObj['data_id']) {
                            dfound = true;
                            break;
                        }
                    }
                    mfound = true;
                    break;
                }
            }
            pfound = true;
            break;
        }
    }
    if (!dfound) {
        dArr.push(dObj);
        mObj['datas'] = dArr;
        dObj = {};
    }

    if (!mfound) {
        mArr.push(mObj);
        pObj['modules'] = mArr;
        mObj = {};
    }

    if (!pfound) {
        pArr.push(pObj);
        pObj = {};
    }

    dArr = [];
    mArr = [];
}

rObj['packages'] = pArr;
console.log(rObj);

这是使用Array#reduce()创建基于包 ID 作为键的分组对象的更通用方法。 您可以使用任何循环来构建相同的对象……例如for()forEach()

然后使用Object.values()从该分组对象中获取最终数组

使用Array#find()类的方法Array#find()简化遍历以查看模块是否已存在于每个包中

 const grouped = data.functions.reduce((a, c )=>{ // if group object doesn't exist - create it or use existing one a[c.package_id] = a[c.package_id] || {package_id : c.package_id, modules: [] } // store reference to the group modules array const mods = a[c.package_id].modules // look within that group modules array to see if module object exists let module = mods.find(mod => mod.module_id === c.module_id) if(!module){ // or create new module object module = {module_id: c.module_id, data:[]} // and push it into modules array mods.push(module); } // push new data object to module data array module.data.push({data_id: c.data_id}) return a }, {}) // create final results object const res = { packages : Object.values(grouped) } console.log(res)
 .as-console-wrapper {max-height: 100%!important;}
 <script> const data = { "functions": [{ "package_id": "2", "module_id": "2", "data_id": "2" }, { "package_id": "1", "module_id": "1", "data_id": "2" }, { "package_id": "2", "module_id": "3", "data_id": "3" } ] } </script>

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM