1. 程式人生 > >javascript之遍歷物件

javascript之遍歷物件

 以下是一個巢狀子物件的物件,遍歷類似這樣的物件稍微有點複雜,於是把方法寫下來,加以鞏固,如果學過資料結構應該看得出,遍歷方法類似於遞迴遍歷,又像是遍歷二叉樹。

var tree = {        //一棵樹
    "id": 0,
    "name": "root",
    "left": {
        "id": 1,
        "name": "Simon",
        "left": {
            "id": 3,
            "name": "Carl",
            "left": {
                "id": 7,
                "name": "Lee",
                "left": {
                    "id": 11,
                    "name": "Fate"
                }
            },
            "right": {
                "id": 8,
                "name": "Annie",
                "left": {
                    "id": 12,
                    "name": "Saber"
                }
            }
        },
        "right": {
            "id": 4,
            "name": "Tony",
            "left": {
                "id": 9,
                "name": "Candy"
            }
        }
    },
    "right": {
        "id": 2,
        "name": "right",
        "left": {
            "id": 5,
            "name": "Carl",
        },
        "right": {
            "id": 6,
            "name": "Carl",
            "right": {
                "id": 10,
                "name": "Kai"
            }
        }
    }
};
                    
                                            將上述所示物件整理成結構圖如上所示

//要求一: 假設id和name均不會重複,根據輸入name找到對應的id
findIdByName("Kai");
function findIdByName(name) {
    var id;
    function findName(obj) {
        if (obj != null) {
            if (obj.name === name) {
                id = obj.id;
                console.log(id);
            }
            findName(obj.left);
            findName(obj.right);
        }
    }
    findName(tree);
}
//要求二: 假設id和name均不會重複,根據輸入id找到對應的name,與要求一相同,不過還是把程式碼貼上了
findNameById(2);
function findNameById(id) {
    var name;
    function findName(obj) {
        if (obj != null) {
            if (obj.id === id) {
                name = obj.name;
                console.log(name);
            }
            findName(obj.left); //遞迴遍歷,相當於遍歷左子樹
            findName(obj.right);//遍歷右子樹
        }
    }
    findName(tree);
}

三種遍歷方式遍歷物件

I.前序遍歷
// 把這個物件中所有的名字以“前序遍歷”的方式全部輸出到console中

getListWithDLR();
function getListWithDLR() {
    function preTraversal(obj) {
        if(obj!=null) {
            console.log(obj.name);
            preTraversal(obj.left);
            preTraversal(obj.right);
        }
    }
    preTraversal(tree);
}

II.中序遍歷

// 把這個物件中所有的名字以“中序遍歷”的方式全部輸出到console中

getListWithLDR();
function getListWithLDR() {
    function midTraversal(obj) {
        if(obj!=null) {
            midTraversal(obj.left);
            console.log(obj.name);
            midTraversal(obj.right);
        }
    }
    midTraversal(tree);
}

III.後序遍歷

// 把這個物件中所有的名字以“後序遍歷”的方式全部輸出到console中

getListWithLRD();
function getListWithLRD() {
    function postTraversal(obj) {
        if(obj!=null) {
            postTraversal(obj.left);
            postTraversal(obj.right);
            console.log(obj.name);
        }
    }

    postTraversal(tree);
}

仔細觀察就可發現,這三種遍歷方式本質上是一致的,只不過遍歷和輸出的順序有所差別,不難理解。