多维对象数组扁平化

719 阅读1分钟

前言

大家好,我是喜欢音乐的前端小白凌零。

初来乍到,最近在项目中,处理对象数组遇到一个有趣的问题。

在一个多维对象数组中根据id的value,查找同对象中name的value,然而其中有list对象里面或为null或存了又一个对象。整个对象数组为树形结构(省略其中的parents字段)。

[
    {
        "id": "10001", 
        "name": "资料目录",   
        "list": [
            {
                "id": "10002",
                "name": "文章1",
                "list": [
                    {
                        "id": "10011",  
                        "name": "标题1", 
                        "list": null
                    },
                    {
                        "id": "10004",
                        "name": "标题2",
                        "list": null
                    }
                ]
            },
            {
                "id": "10009",
                "name": "文章2", 
                "list": null
            }
        ]
    },
    {
        "id": "10014",
        "name": "英语目录", 
        "list": [
            {
                "id": "10015",
                "name": "阅读1",        
                "list": null
            }
        ]
    },  
]

我的思路是将对象数组扁平化,通过新的数组来对应查找值

/**
*@param data 对象数组
*@param id   输入的id值
**/
    count(data,id){
      var data = this.data;
      var id = this.id;
      var json  = [];
      var array = {};
      function recursion(data){
      for(let i = 0; i < data.length ; i++){
          if(data[i].list != null){
            recursion(data[i].list)
          }
          array['id'] = data[i].id;
          array['name'] = data[i].name;
          json.push(array)
          array = {};         
      }
      };
      recursion(data);
      var name = null;
      for(let i = 0 ; i < json.length ; i++){
        if(json[i].id == id){
          name = json[i].name
        }
      }
      console.log(json);          //[{id:10001,name:资料目录},{id:10002,name:文章1}...]
      console.log(name);          //输入id=10001  输出name=资料目录
    },

结语

虽然是个很简单的递归,但是算是我第一个靠自己独立解决的问题,我觉得很有意义。不过这个问题最后是通过后台加多一个数据返回...通过左联找到对应的值。