Javascript-将ParentId更新为嵌套对象

时间:2020-09-12 19:17:39

标签: javascript nested-object

我目前在带有嵌套对象的javascript数组中存储结构。该结构没有parentId参数,我确实需要获取嵌套对象的父级。当前结构输出:

    [{
        "id":1000,
        "pageIndex":0,
        "type":"page",
        "label":"Page 1",
        "rows":[
            {
                "id":1002,
                "type":"row 1",
                "layout":{
                    "gutters":true,
                    "wrapping":false,
                    "guttersDirect":false,
                    "parentId":1002
                },
                "columns":[
                    {
                        "id":1003,
                        "type":"col 1",
                        "layout":{
                            "size":3,
                            "outOf":12,
                            "parentId":1003
                        }
                    },
                    {
                        "id":1004,
                        "type":"col 2",
                        "layout":{
                            "size":3,
                            "outOf":12,
                            "parentId":1004
                        },
                        "elements":[
                            {
                                "id":1006,
                                "type":"text",
                                "label":"Account ID"
                            }
                        ]
                    },
                    {
                        "id":1005,
                        "type":"col 3",
                        "layout":{
                            "size":6,
                            "outOf":12,
                            "parentId":1005
                        }
                    }
                ]
            }
        ]
    }]

我需要一个函数,以父嵌套对象的ID更新所有嵌套对象的parentId属性。

我具有以下功能

   _PREV_PARENT_ID = null;
    assignParentIds(object){
        Object.keys(object).forEach(key => {
            console.log(`key: ${key}, value: ${object[key]}`)
            if(key === "id"){
                this._PREV_PARENT_ID = object[key];
            }else if (typeof object[key] === 'object') {
                if(!!this._PREV_PARENT_ID){
                    object[key]['parentId'] = this._PREV_PARENT_ID;
                }
                this.assignParentIds(object[key])
            }
        });
    }

但是,此函数无法为数组中的项目正确设置父级ID

[
    {
        "id":1000,
        "pageIndex":0,
        "type":"page",
        "label":"Page 1",
        "rows":[
            {
                "id":1002,
                "parentId":1000,
                "type":"row 1",
                "layout":{
                    "gutters":true,
                    "wrapping":false,
                    "guttersDirect":false,
                    "parentId":1002
                },
                "columns":[
                    {
                        "id":1003,
                        "parentId":1002, <--- Correct
                        "type":"col 1",
                        "layout":{
                            "size":3,
                            "outOf":12,
                            "parentId":1003
                        }
                    },
                    {
                        "id":1004,
                        "parentId":1003, <--- In-Correct
                        "type":"col 2",
                        "layout":{
                            "size":3,
                            "outOf":12,
                            "parentId":1004
                        },
                        "elements":[
                            {
                                "id":1006,
                                "parentId":1004,
                                "type":"text",
                                "label":"Account ID"
                            }
                        ]
                    },
                    {
                        "id":1005,
                        "parentId":1006, <--- In-Correct
                        "type":"col 3",
                        "layout":{
                            "size":6,
                            "outOf":12,
                            "parentId":1005
                        }
                    }
                ]
            }
        ]
    }
]

我考虑过也有可能放弃parentId属性,而是使用将返回嵌套父级的函数,但是它也会遇到相同的问题(如果我在id = 1004上调用该函数,它将返回ID = 1003的数组,而不是返回ID 1002的对象。

_PARENT_OBJECT = null;
    findParentByChildId(o, id) {
        if( o.id === id ){
            return o;
        }else{
            if(o.hasOwnProperty('id')){
                this._PARENT_OBJECT = o;
            }
        }
        var result, p; 
        for (p in o) {          
            if( o.hasOwnProperty(p) && typeof o[p] === 'object' ) {             
                result = this.findParentByChildId(o[p], id);
                if(result){                 
                    return this._PARENT_OBJECT;
                }
            }
        }
        return result;  
        
    }

由于用例是关于使用拖放功能的,因此parentId经常会被更新,并且似乎是我们需要跟踪的不必要的额外属性,最好是我有办法调用函数findParentByChildId ()。

最好的管理方式是什么?

1 个答案:

答案 0 :(得分:0)

我想借此机会弄清楚。我制作了遍历每个级别和数组的walker函数,并将其带到上一个级别的id。然后,当它的ID匹配时,它会返回您要查找的父ID。或者,如果不匹配,则返回null

const data = [{
  "id": 1000,
  "pageIndex": 0,
  "type": "page",
  "label": "Page 1",
  "rows": [{
    "id": 1002,
    "type": "row 1",
    "layout": {
      "gutters": true,
      "wrapping": false,
      "guttersDirect": false,
      "parentId": 1002
    },
    "columns": [{
        "id": 1003,
        "type": "col 1",
        "layout": {
          "size": 3,
          "outOf": 12,
          "parentId": 1003
        }
      },
      {
        "id": 1004,
        "type": "col 2",
        "layout": {
          "size": 3,
          "outOf": 12,
          "parentId": 1004
        },
        "elements": [{
          "id": 1006,
          "type": "text",
          "label": "Account ID"
        }]
      },
      {
        "id": 1005,
        "type": "col 3",
        "layout": {
          "size": 6,
          "outOf": 12,
          "parentId": 1005
        }
      }
    ]
  }]
}];

const walkTree = (entry, matchId, parentId = null) => {
  let result = null;
  for (const { id, ...rest } of entry) {
    if (matchId === id) {
      return parentId;
    }
    parentId = id;
    for (const value of Object.values(rest)) {
      if (Array.isArray(value)) {
        result = walkTree(value, matchId, parentId);
        break;
      }
    }
  }
  return result;
};

const findParentByChildId = id => walkTree(data, id);

// ID's to look up parents of.
const lookupParents = [
  1000,
  1002,
  1003,
  1004,
  1005,
  1006,
  1007
];

// Log results.
for (const id of lookupParents) {
  console.log(`Parent of ${id}:`, findParentByChildId(id));
}