记录一次JSON数据处理（省市区数据）

最近在实习工作中遇到了一个需要问题：将后台返回的省市区 json 数据格式化以便前端渲染。这个问题真的是缠绕了我好几天，有思路但是思路特别模糊，今天终于解决了。

返回的数据格式如下：

[

  {

    "children": [

      {

        "children": [

          "东城区",

          "西城区",

          ...

        ],

        "name": "北京市"

      }

    ],

    "name": "北京市"

  },

  {

    "children": [

      {

        "children": [

          "西湖区",

          "余杭区",

           ...

        ],

        "name": "杭州市"

      }

    ],

    "name": "浙江省"

  },...]

我只需要第一级和第二级的 name 数据值，可以使用递归函数来查找，具体看下面的代码：

<script src="https://cdn.bootcdn.net/ajax/libs/jquery/1.12.4/jquery.js"></script>

<script>

// 使用ajax获取数据

function dataFormatterTypeId() {

    let json

    $.ajax({

        url:"administrative-divisions.json",

        type:"get",

        dataType:"json",

        async: false,

        success:function(result){

          //  console.log(result)

           json = result

        }

    })

    return json

}

let res = dataFormatterTypeId()

// console.log(res)

// 核心代码----------------递归实现

function getJson (json) {

  for (let i = 0; i < json.length; i++) {

    if (json[i].children && typeof json[i].children[0] === "object") {

      this.getJson(json[i].children)

    } else {

      json[i].children = undefined

    }

  }

  return json

}

console.log(this.getJson(res))

这里主要的思路是用递归函数实现：使用递归函数设置最后一级 children 的值为undefined 然后返回数据即可。

然而，主要的问题是 终止递归的时机在哪里？我也知道可以通过判断 children 里面的数据部位 Object 类型的时候就可以终止递归，但是，我把最关键的代码写成了 typeof json[i].children[0] === Object,...

好吧，最基础的知识点：typeof 的取值有 "number"、"string"、"boolean"、"object"、"function" 和 "undefined"，注意是字符串。

而今天可能脑子比较清醒，突然想到使用typeof打印以下结果是啥，结果就解决了。

此外，在本地测试，通过jquery ajax 模拟获取数据并返回给全局使用，就是dataFormatterTypeId()函数所作的事情。

巴特西

记录一次JSON数据处理（省市区数据）

最新文章

热门文章