<!DOCTYPE html>

<html>

    <head>

        <meta http-equiv="content-type" content="text/html" />

        <meta name="keywords" content="数组转换成前端更容易解析的树状结构" />

        <meta name="description" content="数组转换成前端更容易解析的树状结构">

        <meta name="author" content="KG" />

        <meta charset="utf-8">

        <title>数组转换成前端更容易解析的树状结构</title>

    </head>

    <body>

        <script>

            var data = [{

                'province': '浙江',

                'city': '温州',

                'code':'10010'

            }, {

                'province': '浙江',

                'city': '杭州',

                'code':'10011'

            }, {

                'province': '安徽',

                'city': '合肥',

                'code':'10012'

            }, {

                'province': '安徽',

                'city': '马鞍山',

                'code':'10013'

            }, {

                'province': '浙江',

                'city': '宁波',

                'code':'10014'

            }];

            function toTree(data) {

                var newData=[],

                hash={};

                for(var i=0;i<data.length;i++){

                    if(!hash[data[i].province]){

                        hash[data[i].province]={

                            'province':data[i].province

                        };

                        hash[data[i].province]['city']=[{

                            'name':data[i].city,

                            'code':data[i].code

                        }];

                        newData.push(hash[data[i].province]);

                    }else if(hash[data[i].province].province==data[i].province){

                        hash[data[i].province]['city'].push({

                            'name':data[i].city,

                            'code':data[i].code

                        })

                    }

                }

                return newData;

            }

            console.log(toTree(data));

        </script>

    </body>

</html>

js 每日一更（数组转换成前端更容易解析的树状结构）的更多相关文章

  1. 【JS】jQuery中将数组转换成字符串join()和push()使用

    1.push()将元素依次添加至数组:2.join()将数组转换成字符串,里面可以带参数分隔符,默认[,] <script type = text/javascript> $(docume ...

  2. js join()函数将数组转换成字符串

    join() 方法用于把数组中的所有元素放入一个字符串.作用是将数组转换为字符串,其作用和toString()相同. 元素是通过指定的分隔符进行分隔的. 例如: var asp=['H','ell', ...

  3. js 判断是否为数组的方式 及 类数组转换成数组格式

    1. 判断是否为数组的通用方式 Object.prototype.toString.call(o)=='[object Array]' 其他方式: typeof ,  instanceof,  ary ...

  4. js将一个具有相同键值对的一维数组转换成二维数组

    这两天,一个前端朋友在面试的笔试过程中遇到了一道类似于"用js实现将一个具有相同code值的一维数组转换成相同code值在一起的二维数组"的题目.他面试过后,把这个问题抛给了我,问 ...

  5. js冒泡法和数组转换成字符串示例代码

    将数组转换成字符串的方法有很多,讲解下js冒泡法的使用.js代码: //js冒泡法与数据转换为字符串的例子 //整理:www.jbxue.com window.onload = function(){ ...

  6. JS 将有父子关系的数组转换成树形结构数据

    将类似如下数据转换成树形的数据 [{ id: 1, name: '1', }, { id: 2, name: '1-1', parentId: 1 }, { id: 3, name: '1-1-1', ...

  7. js 中 json.stringfy()将对象、数组转换成字符串

    json.stringfy()将对象.数组转换成字符串 var student = new Object(); student.name = "Lanny"; student.ag ...

  8. js中如何将伪数组转换成数组

    伪数组:不能调用数组的方法, 1.对象是按索引方式存储数据的 2.它具备length属性 {0:'a',1:'b',length:2} //es5伪数组转换成数组 let args = [].slic ...

  9. JS - 字符串转换成数组，数组转换成字符串

    1.字符串转换成数组: var arr = "1, 2, 3, 4, 5, 6"; arr.split(","); // ["1",&quo ...

随机推荐

  1. Windows服务注册（需要指定config文件的情况下）

    最近,遇到一个问题:需要将telegraf在Win平台下注册为windows服务(避免误操作关闭CMD窗口): 尝试了网上的几种注册Windows服务的方法,发现无法将telegraf这种需要在CMD ...

  2. 云南农职《JavaScript交互式网页设计》 综合机试试卷①——实现购物车的结算

    一.语言和环境 实现语言:javascript.html.css. 开发环境:HBuilder. 二.题目2(100分) 1.功能需求: 马上过节了,电商网站要进行促销活动,需要实现该商城购物车的商品 ...

  3. Ranger-Yarn插件安装

    Ranger-Yarn插件ranger-0.6.0-yarn-plugin安装到Yarn的所有ResourceManager节点, 其他的NodeManager节点不需要安装. 登陆hdfs安装的用户 ...

  4. VNC的安装和使用

    说明 VNC (Virtual Network Console)是虚拟网络控制台的缩写.它是能远程连入Linux进行图形化操作. VNC百度百科介绍:https://baike.baidu.com/i ...

  5. ActiveMQ基础教程（四）：.net core集成使用ActiveMQ消息队列

    接上一篇:ActiveMQ基础教程(三):C#连接使用ActiveMQ消息队列 这里继续说下.net core集成使用ActiveMQ.因为代码比较多,所以放到gitee上:https://gitee ...

  6. ARM微处理器的七种运行模式

    ARM微处理器的七种运行模式: 用户模式(usr):正常的程序执行状态 快速中断模式(fiq):用于处理快速中断,对高速数据传输或通道处理. 中断模式(irq):对一般情况下的中断进行处理. 管理模式 ...

  7. 最小生成树Kruskal算法（1）

    概念 一个有 n 个结点的连通图的生成树是原图的极小连通子图,且包含原图中的所有 n 个结点,并且有保持图连通的最少的边. [1] 最小生成树可以用kruskal(克鲁斯卡尔)算法或prim(普里姆) ...

  8. 双buffer实现无锁切换

    大家好,我是雨乐! 在我们的工作中,多线程编程是一件太稀松平常的事.在多线程环境下操作一个变量或者一块缓存,如果不对其操作加以限制,轻则变量值或者缓存内容不符合预期,重则会产生异常,导致进程崩溃.为了 ...

  9. VC 2010 Express 学生版(中文版)

    Microsoft Visual C++ 2010 Express 学生版 下载传送门(提取码:r7sm) 如何安装 拿到压缩文件后,解压到桌面(别怕,安装完后这个文件夹是可以删除的). 在 &quo ...

  10. Python入门(上)

    Python入门(上) Python入门(上) 简介 Python 基础语法 行与缩进 注释 运算符 标准数据类型 变量 编程流程 顺序(略) 分支 if 循环 for while break 和 c ...