资讯专栏INFORMATION COLUMN

对象扁平化

Aomine / 1156人阅读

摘要:引言中午起来有个人问了我一个题,怎么实现对象扁平化,如图仔细一看这不就是层次遍历么,又仔细一看,我好像还没研究过如何写数据结构,作罢,花了两小时暴力解决思路本来想的是对象或者数组,对象有个好处,可以标识是第几层,但是数组操作比较方便,有的方

引言

中午起来有个人问了我一个题,怎么实现对象扁平化,如图

仔细一看这不就是层次遍历么,又仔细一看,我好像还没研究过js如何写数据结构,作罢,花了两小时暴力解决

思路

本来想的是对象或者数组,对象有个好处,可以标识是第几层,但是数组操作比较方便,有lodash的方法可以直接扁平化,就偷了个懒,但是一下实现方法对象和数组通用,都可以输出正确的结果

代码
var _ = require("lodash");

var obj = {
   a: {
       b: {
           c: {f: "aa"}
       },
       d: {
           e: {g: "bb"},
           h: {i: "cc"}
       },
       j: {
           k: "dd"
       }
   } 
};//f,g,i,c,e,h,k,b,d,j,a

const arrayIncludes = (arr, a) => arr.toString().includes(a.toString()) ;

const sear = (obj, deep, arr) => {
    for(let key in obj) {
        !arr[deep] && (arr[deep] = []);
        var keys = Object.keys(obj);
        !arrayIncludes(arr[deep], keys) && arr[deep].push(Object.keys(obj));
        if(typeof obj[key] === "object") {
            sear(obj[key], deep+1,arr);
        }
    }
    return arr;
}

console.log(sear(obj, 0, {}))
var res = _.flattenDeep(sear(obj, 0, []).reverse());
console.log(res);

结果如下:

$ node 对象扁平化.js
{ "0": [ [ "a" ] ],
  "1": [ [ "b", "d", "j" ] ],
  "2": [ [ "c" ], [ "e", "h" ], [ "k" ] ],
  "3": [ [ "f" ], [ "g" ], [ "i" ] ] }
[ "f", "g", "i", "c", "e", "h", "k", "b", "d", "j", "a" ]

分别是对象方式和数组方式的结果

难点

遇到了二维数组的问题,我的方式是在push每个数组之前都检查一遍存在不存在,有人给的建议是先得到完整的数组再去重,因为我采取的是多维数组,考虑到多维数组去重也许效率了不高?没有仔细研究,问题描述和解决如下
[[[1,2,3],[1,2,3]].includes([1,2,3])返回false](https://segmentfault.com/q/10...

9.30更新

中午起来小伙伴给我发了个改进版的,不用去重,我觉得比我原来的好很多,分享一下

const sear = (obj, deep, arr) => {
    !arr[deep] ? (arr[deep] = Object.keys(obj) ) : (arr[deep] = arr[deep].concat(Object.keys(obj)));
    for(let key in obj) {
        if(typeof obj[key] === "object") {
            sear(obj[key], deep+1,arr);
        }
    }
    return arr;
}

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/80562.html

相关文章

  • 前端数据平化与持久化

    摘要:与持久化工程师花了年时间打造,与同期出现。有持久化数据结构,如等,并发安全。总结篇幅有限,时间也比较晚了,关于前端数据的扁平化与持久化处理先讲这么多了,有兴趣的同学可以关注下,后面有时间会多整理分享。 (PS: 时间就像海绵里的水,挤到没法挤,只能挤挤睡眠时间了~ 知识点还是需要整理的,付出总会有收获,tired but fulfilled~) 前言 最近业务开发,从零搭建网页生成器,...

    dreamtecher 评论0 收藏0
  • 各类型的 toString 方法合集

    摘要:对象覆盖了的方法方法连接数组并返回一个字符串,其中包含用逗号分隔的每个数组元素运用这个方法,可以处理数组扁平化不过有一些限制。 toString() Object.prototype.toString() Array.prototype.toString() Boolean.prototype.toString() RegExp.prototype.toString() String....

    geekidentity 评论0 收藏0
  • JavaScript专题之数组平化

    摘要:专题系列第九篇,讲解如何实现数组的扁平化,并解析的源码扁平化数组的扁平化,就是将一个嵌套多层的数组嵌套可以是任何层数转换为只有一层的数组。 JavaScript 专题系列第九篇,讲解如何实现数组的扁平化,并解析 underscore 的 _.flatten 源码 扁平化 数组的扁平化,就是将一个嵌套多层的数组 array (嵌套可以是任何层数)转换为只有一层的数组。 举个例子,假设有个...

    tuantuan 评论0 收藏0
  • JavaScript专题系列文章

    摘要:专题系列共计篇,主要研究日常开发中一些功能点的实现,比如防抖节流去重类型判断拷贝最值扁平柯里递归乱序排序等,特点是研究专题之函数组合专题系列第十六篇,讲解函数组合,并且使用柯里化和函数组合实现模式需求我们需要写一个函数,输入,返回。 JavaScript 专题之从零实现 jQuery 的 extend JavaScritp 专题系列第七篇,讲解如何从零实现一个 jQuery 的 ext...

    Maxiye 评论0 收藏0
  • JavaScript 数组展开(平化)和underscore的 flatten

    摘要:原文地址数组展开就是将嵌套的数组扁平化转换为一维的判断每一项是否是数组,然后递归递归调用数组在调用会将数组转换成再执行方法会变成还需要将所有的参数转换为数字,所以这种方式的不足就是如果数组里面是既有数字又有字符串,会全部展开为数字转为数字方 原文地址 数组展开就是将嵌套的数组扁平化(转换为一维的)eg: const arr=[[[1, 2], [1, 2, 3]], [1, 2]] ...

    awokezhou 评论0 收藏0

发表评论

0条评论

Aomine

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<