遍歷 JSON 對(duì)象樹(shù)，但找不到任何庫(kù)。這似乎并不困難，但感覺(jué)就像重新發(fā)明輪子。

In XML there are so many tutorials showing how to traverse an XML tree with DOM

如果你認(rèn)為 jQuery 對(duì)于這樣一個(gè)原始任務(wù)來(lái)說(shuō)有點(diǎn)矯枉過(guò)正，你可以這樣做：

//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);

JSON 對(duì)象只是一個(gè) Javascript 對(duì)象。這實(shí)際上就是 JSON 的含義：JavaScript Object Notation。因此，您將遍歷一個(gè) JSON 對(duì)象，但是您通常會(huì)選擇“遍歷”一個(gè) Javascript 對(duì)象。

在 ES2017 中，你會(huì)這樣做：

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

您始終可以編寫(xiě)一個(gè)函數(shù)以遞歸方式下降到對(duì)象中：

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
    }
}

這應(yīng)該是一個(gè)很好的起點(diǎn)。我強(qiáng)烈建議對(duì)此類事情使用現(xiàn)代 javascript 方法，因?yàn)樗鼈兪咕帉?xiě)此類代碼變得更加容易。

function traverse(o) {
    for (var i in o) {
        if (!!o[i] && typeof(o[i])=="object") {
            console.log(i, o[i]);
            traverse(o[i]);
        } else {
            console.log(i, o[i]);
        }
    }
}

有一個(gè)用于使用支持許多不同用例的 JavaScript 遍歷 JSON 數(shù)據(jù)的新庫(kù)。