使用 JavaScript 遍历 JSON 对象树的所有节点

javascript json

2022-08-30 01:53:55

我想遍历JSON对象树，但找不到任何库。这似乎并不困难，但感觉就像重新发明轮子一样。

在 XML 中，有很多教程展示了如何使用 DOM 遍历 XML 树:(

答案 1

如果你认为jQuery对于这样一个原始任务来说有点过分，你可以做这样的事情：

//your object
var o = { 
    foo:"bar",
    arr:[1,2,3],
    subo: {
        foo2:"bar2"
    }
};

//called with every property and its value
function process(key,value) {
    console.log(key + " : "+value);
}

function traverse(o,func) {
    for (var i in o) {
        func.apply(this,[i,o[i]]);  
        if (o[i] !== null && typeof(o[i])=="object") {
            //going one step down in the object tree!!
            traverse(o[i],func);
        }
    }
}

//that's all... no magic, no bloated framework
traverse(o,process);

答案 2

JSON 对象只是一个 Javascript 对象。这实际上就是JSON所代表的：JavaScript Object Notation。因此，您将遍历一个JSON对象，但是您通常会选择“遍历”Javascript对象。

在ES2017中，您将执行以下操作：

Object.entries(jsonObj).forEach(([key, value]) => {
    // do something with key and val
});

您始终可以编写一个函数来递归地下降到对象中：

function traverse(jsonObj) {
    if( jsonObj !== null && typeof jsonObj == "object" ) {
        Object.entries(jsonObj).forEach(([key, value]) => {
            // key is either an array index or object key
            traverse(value);
        });
    }
    else {
        // jsonObj is a number or string
    }
}

这应该是一个很好的起点。我强烈建议使用现代javascript方法来做这些事情，因为它们使编写这样的代码变得更加容易。