js 省市区树结构扁平化获取最后一级

2024-11-03

js树形数据结构的扁平化

前面我们封装了一维数组(具备树形结构相关属性)处理成树形结构的方法:https://www.cnblogs.com/coder--wang/p/15013664.html 接下来我们来一波反向操作,封装一个可以将树形结构的数据扁平化的方法.这种场景在业务中还是很常见的,比如一个级联菜单,有时候你需要判断某个id或者某个字段,是否存在于该级联菜单的多维数组中,亦或者你需要将该多维数组中的字段进行处理,那么此时,对这个树形的复杂数组进行降维就显得很有必要了!下面直接上代码: 1 /** 2 * 3

js中数组扁平化处理

‍

js数据结构处理--------扁平化数组处理为树结构数据

将扁平化的数组处理为树结构数据,我们可以利用对象来处理,对象的复制是浅拷贝,指向相同的内存地址: var arr = [ { id: 0, pid: -1, name: 'sadas' }, { id: 1, pid: -1, name: 'sadas' }, { id: 2, pid: -1, name: 'sadas' }, { id: 3, pid: -1, name: 'sadas' }, { id: 4, pid: 1, name: 'sadas' }, { id: 5, pid: 1

js实现数组扁平化

数组扁平化的方式什么是数组扁平化? 数组扁平化:指将一个多维数组转化为一个一维数组. 例:将下面数组扁平化处理. const arr = [1, [2, 3, [4, 5]]] // ---> [ 1, 2, 3, 4, 5 ] 1.使用flat() flat() 方法是ES10提出的,它会按照一个可指定的深度递归遍历数组,并将所有元素与遍历到的子数组中的元素合并为一个新数组返回.(flat意为"水平的:平坦的") const result1 = arr.flat(Infini

js对象的扁平化与反扁平化

Object.flatten = function(obj){ var result = {}; function recurse(src, prop) { var toString = Object.prototype.toString; if (toString.call(src) == '[object Object]') { var isEmpty = true; for (var p in src) { isEmpty = false; recurse(src[p], prop ? p

JS将扁平化的数据处理成Tree结构

let jsonData= [ { id:1, parentId:0, name:"一级菜单A" }, { id:2, parentId:0, name:"一级菜单B"}, { id:3, parentId:0, name:"一级菜单C"}, { id:4, parentId:1, name:"二级菜单A-A"}, { id:5, parentId:1, name:"二级菜单A-B"}, { id:6,

Ajax获取接口数据，url拼接参数跳转页面，js获取上一级页面参数给本页面

1.Ajax获取接口数据 function demo(){ //假设请求参数 var requestBody = [{ "name":"zhang", "age":"18" }]; //将值转换为JSON字符串 requestBody = JSON.stringify(requestBody); //发起Ajax请求 $.ajax({ //url填自己的 url:"", type:"post&qu

JavaScript数组常用方法解析和深层次js数组扁平化

前言数组作为在开发中常用的集合,除了for循环遍历以外,还有很多内置对象的方法,包括map,以及数组筛选元素filter等. 注:文章结尾处附深层次数组扁平化方法操作. 作为引用数据类型的一种,在处理数组Array的时候,我们需要考虑到深拷贝和浅拷贝的情况可以参考以下文章 javaScript中深拷贝和浅拷贝简单梳理深度解析javaScript常见数据类型检查校验常用数组操作方法 push末尾追加元素 /** * @param push 将一个或多个元素添加到数组的末尾,返回该数组的新长

js数组扁平化

看到一个有趣的题目: var arr = [ [1, 2, 2], [3, 4, 5, 5], [6, 7, 8, 9, [11, 12, [12, 13, [14] ] ] ], 10]; 一个多维数组,要求扁平化,去重且升序,你会怎么做? 我们先从第一步来吧, 实现扁平化: 方法一: 像这种多维数组, 需要循环判断, 因此用while, 不用if(if是一次判断) flatten = (arr) => { while(arr.some(item => Array.isArray(item)

JS: 数组扁平化

数组扁平化什么是数组扁平化? 数组扁平化就是将一个多层嵌套的数组 (Arrary) 转化为只有一层. // 多层嵌套 [1, 2, [3, 4]] // 一层 [1, 2, 3, 4] 递归实现思路是先循环数组,遇到嵌套就递归. function flatten(arr) { let res = []; for (let i=0; i<arr.length; i++) { if (Array.isArray(arr[i])) { res = res.concat(flatten(arr[i]

js技巧-使用reduce实现更简洁的数组对象去重和数组扁平化

Array.prototype.reduce()方法介绍: 感性认识reduce累加器: const arr = [1, 2, 3, 4]; const reducer = (accumulator, currentValue) => accumulator + currentValue; console.log(arr.reduce(reducer)): //10,即1 + 2 + 3 + 4. console.log(arr.reduce(reducer, 6))://16,即6 + 1 +

JS数组专题1️⃣ ➖ 数组扁平化

一.什么是数组扁平化扁平化,顾名思义就是减少复杂性装饰,使其事物本身更简洁.简单,突出主题. 数组扁平化,对着上面意思套也知道了,就是将一个复杂的嵌套多层的数组,一层一层的转化为层级较少或者只有一层的数组. Ps: flatten 可以使数组扁平化,效果就会如下: const arr = [1, [2, [3, 4]]]; console.log(flatten(arr)); // [1, 2, 3, 4] 从中可以看出,使用 flatten 处理后的数组只有一层,下面我们来试着实现一下. 二

js多维数组扁平化

数组扁平化,就是将多维数组碾平为一维数组,方便使用. 一:例如,一个二维数组 var arr = ['a', ['b', 2], ['c', 3, 'x']],将其扁平化: 1. 通过 apply 借用数组的 concat 方法: [].concat.apply([], arr); 结果如下: jQuery 中的 map 方法就用到了这个技巧. 但如果直接调用 concat 方法,[].concat(arr),就没有扁平化效果. 2. 扩展运算符(...) [].concat(...arr)

【JS简洁之道小技巧】第一期扁平化数组

介绍两种方法,一是ES6的flat,简单粗暴.二是递归,也不麻烦. flat ES6自带了flat方法,用于使一个嵌套的数组扁平化,默认展开一个嵌套层.flat方法接收一个数字类型参数,参数值即嵌套层的深度,默认为1.(注意是“嵌套层”不是“层”,如传入0则不展开任何嵌套) 需要注意的是:第一,flat方法一旦使用,必将移除掉数组的empty空项:第二,flat方法返回一个新数组,并不会改变原数组. 由于我们不好确定最大嵌套层的深度,因此有个很暴力的方法,直接传入Infinity,可

扁平化promise调用链（译）

这是对Flattened Promise Chains的翻译,水平有限请见谅^ ^. Promises对于解决复杂异步请求与响应问题堪称伟大.AngularJS提供了$q和$http来实现它:还有很多类似技术这里不做展开. Promises允许开发者很容易得将请求通知与异步请求进行绑定,而它还有另外两个重要的忒性: 在后续请求处理函数被通知前对传参进行转换在响应中可以触发更多的promise式的异步请求但是比以上更重要的是,Promises支持自定义链式活动或计算,管理异步调用链是一个非常困

插件原生js 省市区三级联动源码

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>省市区三级联动</title> <style> /*全局样式*/ * { margin: 0; padding: 0; } fieldset { width: 500px; padding: 20px; margin: 30px; border:

《Entity Framework 6 Recipes》中文翻译系列 (18) -----第三章查询之结果集扁平化和多属性分组

翻译的初衷以及为什么选择<Entity Framework 6 Recipes>来学习,请看本系列开篇 3-14 结果集扁平化问题你有一对多关联的两个实体,你想通过一个查询,获取关联中的两个实体的扁平化投影.扁平化或者叫压缩,这是不规范的叫法.它是指一个有父类和子类的对象图,被投影到一个单独的类中. 解决方案假设你有一对拥有一对多关联的实体,如图3-15所示的模型. 图3-15 模型中,一个代表助理的Associate的实体类型和一个代表助理工资历史的AssociateSalary实体

AppBox升级进行时 - 扁平化的权限设计

AppBox 是基于 FineUI 的通用权限管理框架,包括用户管理.职称管理.部门管理.角色管理.角色权限管理等模块. AppBox v2.0中的权限实现 AppBox v2.0中权限管理中涉及三个概念:模块.用户.角色 1. 权限是定义在模块中,而模块相当于一个分组,比如用户管理就是一个模块.用户分组模块可以包含的多个页面,比如用户列表页面.新增用户页面.修改用户页面.用户详细信息查看页面.修改用户密码页面等: 2. 角色拥有对权限的控制,可以设置一个角色拥有哪些权限: 3. 一个用户可以有

F2工作流引擎Web层全新扁平化UI上线

特点:引入Bootstrap开源UI样式和fontawesome图标集扁平化样式使用界面更舒服,按钮主题可快速定义更换,对于集成到业主系统UI图标更加丰富. 以下截取部分图片展示,更多请联系作者登录F2工作流引擎的演示系统! 演示系统的登录界面待办界面流程管理界面运动状态监控图表 Web在线流程设计器,纯JS实现,通过在线拖.拉.拽,进行流程设计,兼容各大主流浏览器!

1.AutoMapper核心：扁平化

对象 - 对象映射的一个常见用法是获取一个复杂的对象模型,并将其展开成一个更简单的模型. 您可以采取复杂的模型,如: public class Order { private readonly IList<OrderLineItem> _orderLineItems = new List<OrderLineItem>(); public Customer Customer { get; set; } public OrderLineItem[] GetOrderLineItems(

js 省市区树结构 扁平化获取最后一级

热门专题

js 省市区树结构扁平化获取最后一级