一个json对象,包含嵌套关系,传输过来的时候是平铺的,顺序打乱,用parentCode属性来关联,如下

  1. {
  2. "1":{
  3. "name": "中国",
  4. "code": "1",
  5. "parentCode":"0"
  6. },
  7. "12":{
  8. "name": "上海",
  9. "code": "12",
  10. "parentCode":"1"
  11. },
  12. "121":{
  13. "name": "杨浦区",
  14. "code": "121",
  15. "parentCode":"12"
  16. },
    "13":{
  1. "name": "南京",
  2. "code": "13",
  3. "parentCode":"1"
  4. },
  1. "122":{
    "name": "嘉定区",
    "code": "122",
    "parentCode":"12"
    }
    }

parentCode位0的对象是根对象,要求把平铺对象转换成这样的嵌套对象

  1. [
  2. {
  3. "name": "中国",
  4. "code": "1",
  5. "parentCode":"0",
  6. "children":[
  7. {
  8. "name": "上海",
  9. "code": "12",
  10. "parentCode":"1",
  11. "children":[
  12. {
  13. "name": "杨浦区",
  14. "code": "121",
  15. "parentCode":"12"
  16. },
  17. {
  18. "name": "嘉定区",
  19. "code": "122",
  20. "parentCode":"12"
  21. }
  22. ]
  23. },
  24. {
  25. "name": "南京",
  26. "code": "13",
  27. "parentCode":"1"
  28. }
  29. ]
  30. }
  31. ]

思路:

对象是引用变量,直接遍历添加即可,无需按照层级顺序从外到内添加。

  1. function transfer(origin){
  2. var root = null;
  3. Object.keys(origin).forEach(key => {
  4. var obj = origin[key]
  5. if (obj.parentCode === '0') {
  6. root = obj;
  7. return
  8. }
  9. var parent = origin[obj.parentCode];
  10. !parent.children && (parent.children = [])
  11. parent.children.push(obj)
  12. })
  13. return root
  14. }

js对象-平铺与嵌套的互相转换的更多相关文章

  1. js对象跟数组多层嵌套,检测没有此数据就添加有则不添加以及超过限制条件删除操作

    例如你需要这样格式的数据: [{"name":"合肥市","arrey":[{"lat":"31.862323 ...

  2. JS 处理图片平铺问题

    background: url("../../../assets/image/center.png") no-repeat; // 让图片不平铺   overflow: hidde ...

  3. DOM对象和js对象以及jQuery对象的区别

    DOM对象和js对象以及jQuery对象的区别 DOM对象和js对象以及jQuery对象的区别 一.DOM对象 文档对象模型简称DOM,是W3C组织推荐的处理可扩展置标语言的标准编程接口. DOM实际 ...

  4. 5 分钟掌握 JS 实用窍门技巧,帮你快速撸码--- 删除数组尾部元素、E6对象解构、async/await、 操作平铺嵌套多维数组等

    1. 删除数组尾部元素 一个简单方法就是改变数组的length值: const arr = [11, 22, 33, 44, 55, 66]; arr.length = 3; console.log( ...

  5. 一款js控制背景图片平铺

    背景图片的平铺方法有很多种,纯色背景,渐变背景,图片背景,今天讲的是移动端的图片背景~~~~ <style> html,body{;;} .body{background: url(ima ...

  6. JSON平铺功能的实现(JS操作JSON数据)

    一.什么是JSON平铺 JSON平铺分成两种: 平铺的json转树结构的json 例如: { a: 'value', b: 'b1.value' } // 转换成=> { a: 'value', ...

  7. 如何用vue封装一个防用户删除的平铺页面的水印组件

    需求 为了防止截图等安全问题,在web项目页面中生成一个平铺全屏的水印 要求水印内容为用户名,水印节点用户不能通过开发者工具等删除 效果 如上图 在body节点下插入水印DOM节点,水印节点覆盖在页面 ...

  8. CSS背景100%平铺 浏览器缩小背景显示不全解决办法

    本文我们分享前端CSS背景100%平铺,浏览器缩小背景显示不全bug解决的两个方法,如果你也遇到了,那么就可以参考下面文章. 把浏览器的窗口缩小时,拖动滚动条时你会发现原本设定的CSS背景100%平铺 ...

  9. UIImage图片处理,旋转、截取、平铺、缩放等操作

    来源:iOS_小松哥 链接:http://www.jianshu.com/p/9ab1205f5166 有时候我们需要处理图片,比如改变大小,旋转,截取等等,所以今天说一说图片处理相关的一些操作. 本 ...

随机推荐

  1. SQL Server 并发死锁解决案例备忘

    SET @sql = ' SET TRANSACTION ISOLATION LEVEL REPEATABLE READ; SET DEADLOCK_PRIORITY 10 BEGIN TRAN DE ...

  2. oracle-sql模式匹配

    下面是条件 like与regexp_like条件 下面是函数 regexp_instr regexp_replace regexp_substr select * from tis_ft_user_i ...

  3. Windows git 初始设置

    主要布署在 Linux 服务器上时,将全局设置 为提交自动转为 LF,签出不转换.git config --global core.autocrlf input(无效了,按默认即可) 设置全局用户名.

  4. 20165308 预备作业3 Linux安装及学习

    Linux安装及学习 Linux的安装 因为做的比较晚, 安装过程按照老师给出的步骤和同学指导并未出现很多问题,只是安装VirtualBox虚拟机增强功能时,代码没输正确,结果一直无法正确安装,后来也 ...

  5. Vue学习入门

    1.安装WebStorm: 2.激活WebStorm:https://blog.csdn.net/qq_40147863/article/details/81317709 3.安装全局脚手架:npm ...

  6. web 前端安全问题

    转载自:https://segmentfault.com/a/1190000006672214?utm_source=weekly&utm_medium=email&utm_campa ...

  7. Visual Studio中设置Nuget程序包源

    用vs2015,默认的程序包源是Microsoft and .NET,很多常见的开源包在里面搜索不到. 这时候就需要配置一个更开放的包源,网上搜了一下,都没人提供这个问题,所以自己动脑花了一番脑经,看 ...

  8. Pyhanlp自然语言处理中的新词识别

    新词发现 本“新词发现”模块基于信息熵和互信息两种算法,可以在无语料的情况下提取一段长文本中的词语,并支持过滤掉系统中已存在的“旧词”,得到新词列表. 调用方法 静态方法 一句话静态调用接口已经封装到 ...

  9. openwrt lan/wan口自动翻转

    参考: http://www.right.com.cn/forum/thread-75532-1-1.html 该实验基于ar9331 dragino2板子的,板子只引出一个LAN口. 1. 固件编译 ...

  10. Laravel 输出最后一条sql

    $queries = DB::getQueryLog(); $last_query = end($queries); print_r( $last_query);