<!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. Null和空值对于avg计算时产生的影响以及处理

    为什么要关注这一块呢:1.面试中可能会有涉及 2.工作中真的也可能会用,既然有可能我也用过,就拿出来跟大家分享一下,上一篇的博文,数据已准备好就不做数据准备的介绍了. step1:select * f ...

  2. 基于Spring MVC + Spring + MyBatis的【图书信息管理系统（二）】

    资源下载:https://download.csdn.net/download/weixin_44893902/35123371 练习点设计:添加.删除.修改 一.语言和环境 实现语言:JAVA语言. ...

  3. JavaScript交互式网页设计 • 【第4章 JavaScript文档对象模型】

    全部章节   >>>> 本章目录 4.1 文档对象模型简介及属性 4.1.1 文档对象模型概述 4.1.3 实践练习 4.2 document 对象查找 HTML 元素 4.2 ...

  4. Java面向对象笔记 • 【第8章 内部类和泛型】

    全部章节   >>>> 本章目录 8.1 内部类 8.1.1 内部类概述 8.1.2 内部类使用 8.1.3 实践练习 8.2 静态内部类 8.2.1 静态内部类的实现 8.2 ...

  5. getRequestDispatcher 中请求转发和请求包含的使用说明

    getRequestDispatcher() getRequestDispatcher() 包含两个方法,分别是请求转发和请求包含. RequestDispatcher rd = request.ge ...

  6. CSS基础-5 伪类

    一.伪类 我们以a标签为例 伪类标签分为4类     1. 设置超链接默认的样式 a:link {属性:值;.....} 或者 a { 属性: 值;}           推荐使用这种方式     2 ...

  7. HttpRunner_参数化进阶

    一.获取返回包数据   在提取参数时,当 HTTP 的请求响应结果为 JSON 格式,则可以采用.运算符的方式,逐级往下获取到参数值:响应结果的整体内容引用方式为 content 或者 body,如上 ...

  8. 获取iframe外的document

    在iframe中点击弹出层外部分弹出层消失,但是点击iframe外部分就操作不了弹出层了,被这个问题困扰了不少时间,今天得以解决,代码如下: 说明:$(top.document,document).c ...

  9. Kube-OVN1.5.0新版本发布，支持鲲鹏云平台网络平面部署

    近日,Kube-OVN发布了最新的1.5.0版本.自2019年4月开源以来,Kube-OVN经历了15次重要版本迭代,以及社区成立,建设者贡献代码,稳定性测试,国内外用户开始在生产环境中投入使用,企业 ...

  10. 网络协议学习笔记(七)流媒体协议和P2P协议

    概述 上一篇讲解了http和https的协议的相关的知识,现在我们谈一下流媒体协议和P2P协议. 流媒体协议:如何在直播里看到美女帅哥 最近直播比较火,很多人都喜欢看直播,那一个直播系统里面都有哪些组 ...