JavaScript深度迭代遍历未知对象

栏目: JavaScript · 发布时间: 6年前

内容简介:面向对象编程的语言,都存在对对象的一些操作,其中就包括遍历未知对象的属性值。常见的遍历对象的方法:但是对象中又含有子对象,对象的属性又是另一个对象,或者更深层嵌套,上面方法就不适用了;

面向对象编程的语言,都存在对对象的一些操作,其中就包括遍历未知对象的属性值。

通常情况

常见的遍历对象的方法:

var o = {
    name: 'cloud',
    age: 20
}
for (i in o) {
    console.log(i + ': ' + o[i]);
}
// name: cloud
// age: 20

特殊情况

但是对象中又含有子对象,对象的属性又是另一个对象,或者更深层嵌套,上面方法就不适用了;

下面使用 递归 实现这个功能:

var o = {
    name: {
        firstName: 'cloud',
        lastName: 'huang'
    },
    age: 20
}
function myFn(obj) {
    for (i in obj) {
        console.log(i + ': ' + obj[i]);
        // 这里使用递归,属性类型为对象则进一步遍历
        if (typeof(obj[i]) == 'object') {
            myFn(obj[i]);
        }
    }
}
myFn(o);
// 输出:
// name: [object Object]
// firstName: cloud
// lastName: huang
// age: 20

这样的话不论对象有多复杂的结构都能全部遍历到位;

困境

但同时,这也是个问题,一些对象层次非常深甚至是死循环的情况就尴尬了,类似于子对象属性与父对象属性一样,尝试用上诉函数遍历一下浏览器的 window 对象就能体会了,你会后悔的;

所以为避免这种尴尬情况,设置一个 迭代深度值 吧,指定遍历到第几代:

var depth = 0;  // depth为迭代深度值
function myFn(obj) {
    for (i in obj) {
        console.log(i + ': ' + obj[i]);
        depth++;
        if (depth < 10
        && typeof(obj[i]) == 'object') {
            myFn(obj[i]);
        }
    }
}

或者使用一种类似 懒加载 的形式:

function myFn(obj) {
    for (i in obj) {
        console.log(i + ': ' + obj[i]);
        if (typeof(obj[i]) == 'object') {
            // 判断用户是否要继续迭代
            if (confirmFn('是否深入遍历?')) {
                myFn(obj[i]);
            }
        }
    }
}

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持 码农网

查看所有标签

猜你喜欢:

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

打火机与公主裙·荒草园

打火机与公主裙·荒草园

Twentine / 青岛出版社 / 2017-3 / 36.00元

“如果人临死前真有走马灯这个环节,她大概会是我这辈子见的最后一人。” 从青涩的校园时代里一抹明亮的金,到厮杀的职场中那化不开的黑,李峋就像荒芜之地的一株野草,受到再大的挫折依然固执地生长。 如果说朱韵从前的生活一直维持着表面的顺风顺水,平静安和,那李峋的出现则打破了这一切。他是她生命中第一次,也是唯一一次的冒险。 在外人眼里李峋嚣张而轻蔑,只有朱韵懂得他心中那片自留地,自愿成为孤......一起来看看 《打火机与公主裙·荒草园》 这本书的介绍吧!

RGB转16进制工具
RGB转16进制工具

RGB HEX 互转工具

图片转BASE64编码
图片转BASE64编码

在线图片转Base64编码工具

HTML 编码/解码
HTML 编码/解码

HTML 编码/解码