技术标签： html5 js方法 javascript
因为在开发中需要用到省市区数据，但是后端只返回最里层城市的code值
频繁百度找不到很好的方法，很多都是写了好几个方法去调用，并且多次调用导致很难理解；
这里分享一下我根据自己的思路所完成的一个方法。
（方法未经过长久测试，会有未知bug，并且可能会在不同数据体下也会有误差！）
废话：
在城市数据中我们知道，基本由以下三个字段构成：code、name、children
code是省市区的唯一代码，name则是省市区的名称，children则是省市区下的子项。
我们在只查找返回code对应的省市区的名称时很简单，普通的递归就可以实现；
但是如果我们也想要去获取上一层的数据，该怎么拿呢？
思路：
很简单，在递归中，除了第一层的循环，内循环均向下传入父级数据。
第一层循环不传入是因为如果不打断，就会卡死循环。
这个时候我们只能拿到两层数据，当前级和上一级。
那如果还想往上查找，还记得我们传入的父级数据吗，父级的code就起到了作用
重复调用递归方法，注意，此时调用必须传入源数据，也就是一开始的那一大串数据，这个时候调用查找到的就是父级的code和name
方法会一直循环遍历查询，直到已经达到最外层。
我们把我们所需要的数据用一个数组存放起来，并且return出去。
代码：
/**
* 根据code查询城市
* 并查出所有父级
* 原理 ===>
* 通过递归查找code与传入code相同
* 且在查找相同code的同时，将上级内容传递进下级循环中
* 如果code相同了，上级内容自然就能拿到
* 因为不知道有多少个上级
* 所以在查找到之后继续进行递归源数据（这里注意，并不是当前循环数据，而是最根本的数据）
* 这个时候不需要传递当前级的内容，否则无限循环卡死
*/
function getArea(json, code) {
let names = [];
let codes = [];
function findCity(list, code, father) {
const index = list.findIndex(ev => ev.code == code);
if (index > -1) {
const child = list[index];
names.unshift(child.name);
codes.unshift(child.code);
father && names.unshift(father.name) && codes.unshift(father.code);
father && findCity(json || [], father.code);
return;
}
list.map(item => {
if (item.children) {
findCity(item.children || [], code, item);
}
})
}
findCity(json, code);
names = [...new Set(names)];
codes = [...new Set(codes)];
return { codes, names };
}
const list = getArea(cityJson, parseInt(code));
console.log(list);文章浏览阅读7.4k次。冬至，太阳直射南回归线，正午太阳高度由南回归线向南北递减，北京是北纬40度，与南回归线纬度差63度26分，所以北京正午太阳高度，即阳光与地的夹角为26度24分。注：冬至位置是南回归线，夏至是北回归线位置，中国在北回归线以北（所以我们的房子只有南面采光，太阳永远在我们南面）看图就能知道冬至时，太阳离中国位置最远，角度最小，采光最差，所以冬至这段时间，房屋采光如果可以的话，那全年采光没_北京是北纬40度,与南回归线纬度差63度26分。冬至太阳直射南回归线,正午太阳高度由
服务注册与发现是微服务架构中不可或缺的重要组件。起初服务都是单节点的，不保障高可用性，也不考虑服务的压力承载，服务之间调用单纯的通过接口访问。直到后来出现了多个节点的分布式架构，起初的解决手段是在服务前端负载均衡，这样前端必须要知道所有后端服务的网络位置，并配置在配置文件中。如果需要调用后端服务A-N，就需要配置N个服务的网络位置，配置很麻烦后端服务的网络位置变化，都需要改变每个调用者的配置既然有这些问题，那么服务注册与发现就是解决这些问题的。
是一个现代的浏览器 API，用于监测一个或多个目标元素与其祖先元素或视窗（viewport）之间的交叉状态（intersection）的变化。它可以有效地监听元素是否进入或离开可视区域，从而实现一些懒加载、无限滚动、图表加载等需求。
Channel 是一个并发安全的阻塞队列，可以通过 send 函数往队列中塞入数据，通过 receive 函数从队列中取出数据。当队列被塞满时，send 函数将被挂起，直到队列有空闲缓存；当队列空闲时，receive 函数将被挂起，直到队列中有新数据存入。Channel 中队列缓存空间的大小需要在创建时指定，如果不指定，缓存空间默认是 0。
ORACLE LINUX 7.9 上安装 Caché数据库。该文介绍了在LINUX上安装Caché数据库的步骤，包括下载安装介质和访问链接信息。
文章浏览阅读2.3k次。原文链接：https://blog.csdn.net/misayaaaaa/article/details/533964031：dlmwrite()函数保存成txt文件使用方法：dlmwrite('filename', M)使用默认分隔符“,”将矩阵M写入文本文件filename中；dlmwrite('filename', M, 'D')..._matlab中的 store
文章浏览阅读6.1k次，点赞5次，收藏14次。写在前面：虚链路被视为是骨干区域area0的一个延伸，因此如果在路由器上开启了area0的区域认证，那么要注意虚链路也要参与认证。1.网络拓扑图链接：https://pan.baidu.com/s/1SA7nmvomJziYq5x8U18gtA提取码：8888eNSP链接：https://pan.baidu.com/s/1wP0vHim4yqVV0bc0wmzhFw提取码：88882.网络需求a.R1、R2、R3及R4运行OSPF；b. 由于Area2未与Area0直连，因此网络中OSP_ospf的vlink开认证
文章浏览阅读3.8k次。基于Springcloud+ Springsecurity oauth2.0 + jwt 实现一个认证授权手脚架一.用户的认证与授权什么是用户身份认证？用户身份认证即用户去访问系统资源时系统要求验证用户的身份信息，身份合法方可继续访问。常见的用户身份认 证表现形式有：用户名密码登录，指纹打卡等方式。什么是用户授权？用户认证通过后去访问系统的资源，系统会判断用户是否拥有访问资源的权限，只允..._spring cloud oauth 2.0 enablewebsecurity
文章浏览阅读490次。1.格式化选python基础教程择时间Start_Time.Format = DateTimePickerFormat.Custom; Start_Time.CustomFormat = "yyyy-MM-dd-HH:mm";2.时间c#教程比较大小DateTime t1 = DateTime.Parse(Start_Time.Text.Trim());DateTime t2 = DateTime.Parse(End_Time.Text.Trim());if (DateTime.Compare_vb.net datetimepicker 怎么选时间
详细介绍了引用循环出现的场景及为什么会出现引用循环，以及如何解决引用循环，引入了weak的概念。
指的是在项目无需重启的情况下，只需要刷新页面，即可获得已经修改的样式或功能。要注意该工具一般用于开发环境，在生产环境中最好不要添加这个工具。对于无需重启便可刷新这么方便的工具，在项目中该如何使用：在spring boot 项目中使用工具的方法就是引入相关依赖，热部署工具的依赖如下：
文章浏览阅读589次。SpringBean的注入原理spring是在配置类需要指定扫描包,然后递归得到下面所有的文件;(springboot默认启动类和兄弟目录下面所有的包文件)包名+文件名=类全限定名;calss.from加载到内存当中,得到字节码(class);判断这个类的脑门上是否有注解(就是类的头顶上),有注解的话,就把这个类先put到Map里面(ResourcesMap和autowiredMap各一..._springioc注入原理