最近在实习工作中遇到了一个需要问题:将后台返回的省市区 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数据处理(省市区数据)的更多相关文章

  1. 【多端应用开发系列1.1.1 —— Android:使用新浪API V2】服务器Json数据处理——Json数据概述

    [前白] 一些基础的东西本系列中就不再详述了,争取尽量写些必不可少的技术要点. 由于本系列把Web Service 构建放到了第二部分,Android项目就采用新浪微博API v2作为服务器端. [原 ...

  2. iOS开发——数据解析Swift篇&简单json数据处理

    简单json数据处理 //loadWeather var url = NSURL(string: "http://www.weather.com.cn/adat/sk/101240701.h ...

  3. 数据库记录转换成json格式 (2011-03-13 19:48:37) (转)

    http://blog.sina.com.cn/s/blog_621768f30100r6v7.html 数据库记录转换成json格式 (2011-03-13 19:48:37) 转载▼ 标签: 杂谈 ...

  4. $.ajax返回的JSON格式的数据后无法执行success的解决方法

    近段时间做项目,在项目使用了ajax技术,遇到了一个奇怪的问题:"$.ajax返回的JSON格式的数据无法执行success",代码是这样写的: 1 $.ajax({ 2 .. 3 ...

  5. Android Volley获取json格式的数据

    为了让Android能够快速地访问网络和解析通用的数据格式Google专门推出了Volley库,用于Android系统的网络传输.volley库可以方便地获取远程服务器的图片.字符串.json对象和j ...

  6. Android中解析JSON形式的数据

    1.JSON(JavaScript Object Notation) 定义: 一种轻量级的数据交换格式,具有良好的可读和便于快速编写的特性.业内主流技术为其提供了完整的解决方案(有点类似于正则表达式, ...

  7. Spark SQL JSON数据处理

    背景   这一篇可以说是“Hive JSON数据处理的一点探索”的兄弟篇.   平台为了加速即席查询的分析效率,在我们的Hadoop集群上安装部署了Spark Server,并且与我们的Hive数据仓 ...

  8. 如何使用JSON格式 POST数据到服务器

    1. JSON的数据格式a) 按照最简单的形式,可以用下面这样的 JSON 表示名称/值对: { "firstName": "Brett" } b) 可以创建包 ...

  9. .NET MVC Json()处理大数据异常解决方法

    [1-部分原文]: .NET MVC Json()处理大数据异常解决方法 整个项目采用微软的ASP.NET MVC3进行开发,前端显示采用EasyUI框架,图表的显示用的是Highcharts,主要进 ...

随机推荐

  1. Redis安装过程jemalloc/jemalloc.h报错

    问题: [root@localhost redis-3.0.0]# make cd src && make all make[1]: Entering directory `/data ...

  2. Centos安装redis详解

    redis官方网站对redis的安装已有介绍,但没有redis环境的安装,redis自动启动服务安装等等: redis官网:https://redis.io 本文以centos6为基础安装redis ...

  3. elasticSearch中集群状态的guan'l

    es中集群出现上面的问题一般是磁盘空间不够引起的,就是node节点所在的磁盘空间不足引起的 es整个集群放在c盘,都快满了 说明es的磁盘已经快被使用完了,我们可以临时更新下磁盘空间大小 修改 ES分 ...

  4. jni不通过线程c回调java的函数 --总结

    1.JNIEnv类型是一个指向全部JNI方法的指针.该指针只在创建它的线程有效,不能跨线程传递 2.JavaVM是虚拟机在JNI中的表示,一个JVM中只有一个JavaVM对象,这个对象是线程共享的. ...

  5. Selenium+java - Edge浏览器启动

    写在前面 随着win10系统的普及,使得Edge浏览器得到广泛使用.从自动化角度看,自然微软也一直不断提供着支持服务,系统版本更新,对应的Edge浏览器版本也在更新,当然对应的驱动版本也会发生变化. ...

  6. 【WPF】DataGrid多表头的样式设计

    需求 在使用WPF开发时,使用DataGrid列表显示数据时,有些字段可以进行分组显示,用于更好的表达它们之间存在的某种关系,因此就考虑到要对DataGrid的表头进行扩展,可以显示多行表头,让这些有 ...

  7. Oracle数据库的闪回操作(查询指定时间的数据、恢复数据)

    通过DELETE删除数据后相当于放入回收站,一般情况下可以找回:通过UPDATE更新数据后数据库也会保留数据快照.闪回就是恢复指定时间的数据快照以达到恢复数据的目的.根据步骤一查询出数据快照,恢复数据 ...

  8. Python趣味入门4:选择往往是最重要的-条件语句

    人生处处有选择,程序也有选择,为了让程序变得更加强壮,程序员必须考虑任何情况,上一篇了解到了如何使用Python来行顺序语句的编写,我们写了一个可以输入姓名的生日祝贺程序,今天我们挑战条件语句! 1. ...

  9. 转载------一小时包教会 —— webpack 入门指南

    本文写的蛮好,转载地址:http://www.w2bc.com/Article/50764 其他的地址: http://webpack.github.io/docs/usage-with-gulp.h ...

  10. 1. 初识Jackson -- 世界上最好的JSON库

    要想人前显贵,必须背后受罪.关注公众号[BAT的乌托邦]开启专栏式学习,拒绝浅尝辄止.本文 https://www.yourbatman.cn 已收录,里面一并有Spring技术栈.MyBatis.中 ...