javascript - 一维和嵌套的json对象数组之间如何使用JS转化?

查看:130
本文介绍了javascript - 一维和嵌套的json对象数组之间如何使用JS转化?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

问 题

这两种数据格式如何通过JS相互转化?
相同的内容,扁平化的组合成嵌套的,嵌套的拆解成扁平化的格式
弄了半天弄不出来,求助!

[
    {
        "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
    }
]

解决方案

利用递归实现

// 待处理数值 
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。

这篇关于javascript - 一维和嵌套的json对象数组之间如何使用JS转化?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆