記錄一次JSON數據處理(省市區數據)

最近在實習工做中遇到了一個須要問題:將後臺返回的省市區 json 數據格式化以便前端渲染。這個問題真的是纏繞了我好幾天,有思路可是思路特別模糊,今天終於解決了。
返回的數據格式以下:html

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

此外,在本地測試,經過jquery ajax 模擬獲取數據並返回給全局使用,就是dataFormatterTypeId()函數所做的事情。ajax

相關文章
相關標籤/搜索