Question

我已声明了一个三重嵌套对象，如下所示：

var food = {
    "fruit": {
        "apples": {
            "redApples": 20,
            "greenApples": 30
        },
        "bananas": {
            "yellowBananas": 10
        }
    },
    "grains": {
        "bread": {
            "brownBread": 50
        }
    }
};

我找到了this question，它用于迭代对象的一个对象，但我被卡住了。我将如何遍历此对象？

更新：对于这个特定问题，嵌套的for循环可以正常工作，如下所示：

for(var key in food)
    for(var prop in food[key])
        for(var foo in food[key][prop])
            console.log(food[key][prop][foo]);

但是，下面有一些很好的递归函数可以对无限期嵌套的对象执行此操作。

Answer 1

马丁是对的，递归功能就是这个方法。你的函数应该检查对象的属性。如果是 - 函数必须通过调用自身来更深入，但是使用嵌套对象。

function recursiveIter(obj){
    for (var i in obj){
        if (typeof obj[i]=="object"){
            recursiveIter(obj[i]);
        }
        else {
            $('.ins').append(obj[i]);  // or what do you want to do with that           
        }
    }
}

recursiveIter(food);

jsfiddle采用这种方法。

Answer 2

您可以创建一个接受对象和回调的通用函数，然后进行递归调用。

function objectWalk (obj, callback){
    for(o in obj){
        if(typeof obj[o] === 'object'){
            objectWalk(obj[o], callback);
        }else {
            callback(obj[o]);
        }
    }
}

我在这里做的是循环遍历对象并检查循环中的每个项目是否为对象。如果是，请再次调用相同的功能。如果不是，则将对象的值传递给回调。它是一个方便的小功能。

在行动here中查看。

Answer 3

喜欢这个吗？

walk = function(obj, fn, key) {
    if(typeof obj != "object")
        return fn(obj, key)
    for(var p in obj)
        if(obj.hasOwnProperty(p))
            walk(obj[p], fn, p)
}

或以更简洁的方式使用ES5函数：

walk = function(obj, fn, key) {
    return obj === Object(obj) ? 
        Object.keys(obj).forEach(function(p) { walk(obj[p], fn, p) }) : 
        fn(obj, key);
}

示例：

var food = {
    "fruit": {
        "apples": {
            "redApples": 20,
            "greenApples": 30
        },
        "bananas": {
            "yellowBananas": 10
        }
    },
    "grains": {
        "bread": {
            "brownBread": 50
        }
    }
};

walk(food, console.log.bind(console))

结果：

20 "redApples"
30 "greenApples"
10 "yellowBananas"
50 "brownBread"

在Javascript中循环遍历三重嵌套对象

3 个答案: