javascript - Wie konvertiere ich mit JS zwischen eindimensionalen und verschachtelten Arrays von JSON-Objekten?
習慣沉默
習慣沉默 2017-05-19 10:13:06
0
3
707

Wie konvertiert man diese beiden Datenformate über JS ineinander?
Derselbe Inhalt, die flachen werden zu verschachtelten Formaten zusammengefasst und die verschachtelten werden in flache Formate zerlegt
Ich konnte es nach langer Zeit nicht mehr herausfinden, bitte helfen Sie!

[
    {
        "id":1,
        "number":"100.000",
        "name": "admin.",
        "level":1,
        "children": [
            {
                "id": 2,
                "number": "100.210",
                "name": "admin.marketing",
                "level": 2
            },
            {
                "id": 3,
                "number": "100.260",
                "name": "admin.operation",
                "level": 2,
                "children": [
                    {
                        "id": 5,
                        "number": "260.261",
                        "name": "operation.content",
                        "level": 3
                    },
                    {
                        "id": 6,
                        "number": "260.262",
                        "name": "operation.promote",
                        "level": 2
                    },
                    {
                        "id": 7,
                        "number": "260.263",
                        "name": "operation.service",
                        "level": 2
                    }
                ]
            },
            {
                "id": 4,
                "number": "100.280",
                "name": "admin.development",
                "level": 2
            }
        ]
    }
]
[
  {
      "id":1,
      "number":"100.000",
      "name": "admin.",
      "level":1
  },
  {
      "id": 2,
      "number": "100.210",
      "name": "admin.marketing",
      "level": 2
  },
  {
      "id": 3,
      "number": "100.260",
      "name": "admin.operation",
      "level": 2
  },
  {
      "id": 4,
      "number": "100.280",
      "name": "admin.development",
      "level": 2
  },
    {
        "id": 5,
        "number": "260.261",
        "name": "operation.content",
        "level": 3
    },
    {
        "id": 6,
        "number": "260.262",
        "name": "operation.promote",
        "level": 3
    },
    {
        "id": 7,
        "number": "260.263",
        "name": "operation.service",
        "level": 3
    }
]
習慣沉默
習慣沉默

Antworte allen(3)
滿天的星座

利用递归实现

// 待处理数值 
var data = [
    {
        "id":1,
        "number":"100.000",
        "name": "admin.",
        "level":1,
        "children": [
            {
                "id": 2,
                "number": "100.210",
                "name": "admin.marketing",
                "level": 2
            },
            {
                "id": 3,
                "number": "100.260",
                "name": "admin.operation",
                "level": 2,
                "children": [
                    {
                        "id": 5,
                        "number": "260.261",
                        "name": "operation.content",
                        "level": 3
                    },
                    {
                        "id": 6,
                        "number": "260.262",
                        "name": "operation.promote",
                        "level": 2
                    },
                    {
                        "id": 7,
                        "number": "260.263",
                        "name": "operation.service",
                        "level": 2
                    }
                ]
            },
            {
                "id": 4,
                "number": "100.280",
                "name": "admin.development",
                "level": 2
            }
        ]
    }
]

// 递归函数
function headFor(o, cb){
    if (!o) return; 

    o.forEach(child => {
        cb(child); 
        if (child.children) {
            headFor(child.children, cb);    
        }
    });
}

// 遍历 data 的结果保存在 res 
var res = []; 

// 调用 递归函数headFor  (注意 第二个参数是函数)
headFor(data, item => {
    var temp = {}; 
    temp.id = item.id
    temp.number = item.number;
    temp.name = item.name; 
    temp.level = item.level; 
    res.push(temp); 
}); 

// 告诉数组怎么判断两个元素 然后让他数组自己去干 
res.sort((a, b) => {
    return a.id > b.id; 
}); 

// 打印 
res.forEach(e => console.log(e)); 
console.log(JSON.stringify(res)); 

最外面的data是数组,其实他可以被认为是外层的 children 属性,而data的子元素自己也说不定有 children。

巴扎黑

现在逆向的方法也在群友owl的帮助下完成了!

    var data=[
        {
            "id":1,
            "number":"100.000",
            "name": "admin.",
            "level":1
        },
        {
            "id": 2,
            "number": "100.210",
            "name": "admin.marketing",
            "level": 2
        },
        {
            "id": 3,
            "number": "100.260",
            "name": "admin.operation",
            "level": 2
        },
        {
            "id": 4,
            "number": "100.280",
            "name": "admin.development",
            "level": 2
        },
        {
            "id": 5,
            "number": "260.261",
            "name": "operation.content",
            "level": 3
        },
        {
            "id": 6,
            "number": "260.262",
            "name": "operation.promote",
            "level": 3
        },
        {
            "id": 7,
            "number": "260.263",
            "name": "operation.service",
            "level": 3
        }
    ];

    var res = [];
    var dicKey = {};
    data.forEach((m,i) => {
        var mStr = String(m.name).substr(0,String(m.name).indexOf(".")+1);
        var isParent = String(m.name).charAt(m.name.length -1) == ".";
        if(dicKey[mStr] == undefined)
        {
            dicKey[mStr] = [];
            if(!isParent)   dicKey[mStr].push(i);
        }else{
            dicKey[mStr].push(i);
        }
    });
    function getTreeJson(obj){
        var key = String(obj.name).charAt(obj.name.length -1) == "." ? obj.name:String(obj.name).substr(String(obj.name).indexOf(".")+1) + ".";
        if(dicKey[key])
        {
            dicKey[key].forEach(c =>{
                if(!obj.children) obj.children = [];
                obj.children.push(data[c]);
                getTreeJson(data[c]);
            });
        }
    }
    data.forEach(m => {
        if(String(m.name).charAt(m.name.length -1) == ".")
        {
            res.push(m);
            getTreeJson(m);
        }
    });

    // 打印
    console.log(JSON.stringify(dicKey));
    console.log(JSON.stringify(res));

为情所困
var data = [
    {
        "id":1,
        "number":"100.000",
        "name": "admin.",
        "level":1,
        "children": [
            {
                "id": 2,
                "number": "100.210",
                "name": "admin.marketing",
                "level": 2
            },
            {
                "id": 3,
                "number": "100.260",
                "name": "admin.operation",
                "level": 2,
                "children": [
                    {
                        "id": 5,
                        "number": "260.261",
                        "name": "operation.content",
                        "level": 3
                    },
                    {
                        "id": 6,
                        "number": "260.262",
                        "name": "operation.promote",
                        "level": 2
                    },
                    {
                        "id": 7,
                        "number": "260.263",
                        "name": "operation.service",
                        "level": 2
                    }
                ]
            },
            {
                "id": 4,
                "number": "100.280",
                "name": "admin.development",
                "level": 2
            }
        ]
    }
]
var arr = [];
function selirizeData(data){
    data.forEach(function(element) {
        var item = {};
        for(val in element){
            if(val !== 'children'){
                item[val] = element[val];
            }else{
                selirizeData(element['children']);
            }
        }
        arr.push(item);
    }, this);
};
selirizeData(data);
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage