首页 > 其他分享 >多层嵌套的对象扁平化处理

多层嵌套的对象扁平化处理

时间:2023-02-10 17:35:25浏览次数:40  
标签:扁平化 val Object b2 b22 多层 嵌套 flatten key

对象Object

将多层嵌套的Object做扁平化处理

例如:将看上去很恶心的object

let obj = {
  a:1,
  b:{
    b1:3,
    b2:[{
        b21:1,
        b22:{
          b221:2,
          b222:[1,2,3],
          b223:{}
        }
      },
      22
    ]
  },
  c:[1,2,3]
}

处理成

{
  a: 1,
  b.b1: 3,
  b.b2[0].b21: 1,
  b.b2[0].b22.b221: 2,
  b.b2[0].b22.b222[0]: 1,
  b.b2[0].b22.b222[1]: 2,
  b.b2[0].b22.b222[2]: 3,
  b.b2[0].b22.b223: {},
  b.b2[1]: 22,
  c[0]: 1,
  c[1]: 2,
  c[2]: 3
}

方法一: 递归

递归是最容易想到的办法也是常见的处理多层循环的办法
分析:
1.首先如果是 基础数据类型 的话直接进行赋值就行 ==》 扩展1: js基础数据类型有哪些? 扩展2: 如何判断是不是基础数据类型?
2. 如果是个 数组 要考虑是否为空数组,空数组直接赋值[], 如果不是就遍历递归调用自定义的flatten方法; ==》 扩展3: 判断是否为数组的方法有哪些?
3. 如果是个Object对象,一样先考虑是不是空对象,空Object直接赋值{},否则遍历递归调用自定义的flatten方法 ==》 扩展4: 判断是否为Object对象的方法有哪些?
==> 扩展5:Object的遍历方式有哪几种?

function flattenObj (paramObj) {
  let result = {}
  function flatten(key, val) {
    if (Object(val) !== val) {     //通过该方法可以判断是不是基础数据类型
      if (key) result[key] = val
    } else if (Object.prototype.toString.call(val) === '[object Array]') {  //是个数组
      if (val.length === 0) {
        result[key] = []
      } else {
        val.map((item, index) => {
          flatten(`${key}[${index}]`, item)
        })
      }
    } else {
      if (Object.keys(val).length === 0 && key) result[key] = {}
      for (let _key in val) {
        flatten(key ? `${key}.${_key}`: _key, val[_key])
      }
    }
  }
  flatten('', paramObj)
  return result
}

image



** 文中提到的扩展的知识点,旨在提示对于知识点的巩固和扩展,后面会以博客形式统一整理输出;


标签:扁平化,val,Object,b2,b22,多层,嵌套,flatten,key
From: https://www.cnblogs.com/yejingxiao/p/17102415.html

相关文章

  • 数据库(3)--嵌套查询和连接查询
    上一篇:数据库(2)--加深对统计查询的理解,熟练使用聚合函数:​​https://blog.51cto.com/hwuu/6040381​​一、内容要求从下面10个题目中选一个,第一题查询用连接查询和嵌套查询......
  • jmeter函数嵌套(含其他内置函数)
    举个栗子,当前有两个变量A1、A2,还有一个N=1${A1}:可以正常引用${A${N}}:不可以这样使用,因为不支持函数嵌套${__V(A${N})}:可以这样使用,A${N}会变成A1,__V函......
  • 结构体嵌套
    和json很像packagemainimport"fmt"typeaddressstruct{provincestringcitystring}typepersonstruct{namestringageintaddraddres......
  • element表单嵌套检验+动态添加
    在写表单的时候,容易碰到这种嵌套表单的数据校验,并且这种表单是动态添加的,网上大部分的做法是表单套表单,实际上只需要一个表单就可以了。为了方便观看,这里只列举了两条数......
  • mysql嵌套查询更新
    先上个mysql报错sql语句UPDATEt_stub_groupSETFRANCHISE=1WHEREIDIN(SELECTIDFROMt_stub_groupWHEREMODIFY_TIME<'2023-02-0804:05:12')报错信息109......
  • 多层嵌套的数组扁平化处理
    数组将多层嵌套的数组做扁平化处理例如:类似于将letarr=[1,2,3,[4,[5,6,[7],8]],9]处理成[1,2,3,4,5,6,7,8,9]方法一:递归functionflattenArr(arr){leta......
  • navMenus 的动态路由 嵌套 2
    <template><el-colid="navMenu"><el-menu:default-active="defaultActive"background-color="#0b172e"text-color="#A7B1C2"active-text-c......
  • navMenus 的动态路由 嵌套 1
    <template> <divclass="navMenu">  <templatev-for="menuinnavMenus">   <el-submenu    :key="menu.path"    :index="menu.path"......
  • java控制结构1之if else和嵌套分支
    1.程序流程控制介绍在程序中,程序运行的流程控制决定程序是如何执行的,是我们必须掌握的,主要有三大流程控制语句。1)顺序控制2)分支控制3)循环控制2.顺序结构2.1不做......
  • 【HTML】HTML 标签 ① ( 骨架标签 | 双标签和单标签 | 嵌套关系和并列关系 | 文档类型
    文章目录​​一、HTML标签简介​​​​二、HTML骨架标签​​​​三、双标签和单标签​​​​四、嵌套关系和并列关系​​​​五、文档类型​​​​六、页面语言​​​​七......