Question amusante JavaScript : comparaison approfondie des objets

Comparer deux objets en JavaScript n'est pas une tâche facile, et il ne fournit pas lui-même une telle API.

Si vous souhaitez utiliser l'opérateur "==" pour comparer deux objets, vous vous trompez.

L'opérateur "==" retournera vrai uniquement lorsque les variables gauche et droite pointent vers le même objet.

Par exemple, dans l'exemple suivant, false sera définitivement renvoyé.

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

Alors, quelle est la norme pour comparer deux objets ?

1. Ont-ils le même nom d'attribut

2. Ont-ils la même valeur d'attribut

Par exemple, les deux objets a et b ci-dessus, ils ont tous les deux Le nom d'attribut "name" a la valeur d'attribut "Joe", on peut donc dire qu'ils sont "similaires".

En d'autres termes, notre objectif cette fois est de déterminer si deux objets JS sont "similaires".

Les deux objets ci-dessus sont très simples. Si nous rencontrons des objets imbriqués dans des objets, cela deviendra compliqué.

Comme il existe de nombreux types d'objets, tels que les objets normaux, les objets fonction et les objets date, leur comparaison augmentera la complexité du programme. Par conséquent, nous ne considérons ici que quelques cas : les objets ordinaires ({. } ), les objets tableau ([]) et les types primitifs simples (chaîne, nombre, booléen, nul, non défini).

Même si les exigences sont simplifiées, il n'est pas facile d'obtenir cette similitude. Ci-dessous, j'utilise une traversée approfondie des objets pour comparer les noms d'attributs et les valeurs des objets un par un.

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

Ce qui précède est le contenu des questions intéressantes JavaScript : comparaison approfondie des objets. Pour plus de contenu connexe, veuillez faire attention au site Web PHP chinois (www.php.cn) !