JavaScript趣題：深度比較對象

在JavaScript中比較兩個物件不是件輕鬆的活兒，而且它本身並沒有提供這樣的API。

如果你想用"=="運算子來比較兩個對象，那就大錯特錯了。

"=="運算子只有在左右兩邊的變數指向同一個物件的時候，才會回傳true。

譬如如下的例子，就一定會回傳false。

var a = { name: 'Joe' };  
var b = { name: 'Joe' };  
a == b;  //-> false

那麼咋們比較兩個物件的標準是什麼呢？

1.它們是否有同樣的屬性名

2.它們是否有同樣的屬性值

比如上面的a,b兩個對象，它們都有為「name」的屬性名，都有為「Joe 」的屬性值，所以就可以說，它們是「相似的」。

換句話說，我們此次的目的，是判斷，兩個JS物件是否是「相似的」。

上面的兩個物件都很簡單，如果我們遇到物件嵌套物件的情況，就會變得複雜起來。

因為對象的類型有很多種，比如正則對象，函數對象，日期對象，對它們的比較會增加程序複雜程度，因此，在這裡我們只考慮幾種情況：普通對象（{}），數組對象（[]）和簡單基本類型（string,number,boolean,null,undefined）。

即使簡化了需求，完成這個比較相似也不是件容易的事兒，在下面我用到了深度遍歷對象，逐一比較對象的屬性名和值。

function deepCompare(o1, o2) {  
    //标识是否相似  
    var flag = true;  
      
    var traverse = function(o1,o2){  
        //如果至少有一个不是对象  
        if(!(o1 instanceof Object) || !(o2 instanceof Object)){  
            if(o1 !== o2){  
                flag = false;  
            }  
            return;  
        }  
        //如果两个对象的属性数量不一致  
        //比如：  
        //a:{name:"Jack",age:22}  
        //b:{name:"Jack"}  
        if(Object.keys(o1).length != Object.keys(o2).length){  
            flag = false;  
        }  
        //若有不同之处，尽早结束递归  
        if(flag){  
            //深度遍历对象  
            for(var i in o1){  
                //若都是对象，继续递归  
                if(typeof o1[i] === "object" && typeof o2[i] === "object"){  
                    traverse(o1[i],o2[i]);  
                }//若都不是对象，则比较值  
                else if(typeof o1[i] !== "object" && typeof o2[i] !== "object"){  
                    if(o1[i] !== o2[i]){  
                        flag = false;;  
                    }  
                }//一个是对象，一个不是对象，肯定不相似  
                else{  
                    flag = false;  
                }  
            }  
        }  
    };  
      
    traverse(o1,o2);  
      
    return flag;  
};

以上就是 JavaScript趣題：深度比較對象的內容，更多相關內容請關注PHP中文網（www.php.cn）！