当前位置: 首页 > 科技观察

JavaScript对象比较的四种方法

时间:2023-03-14 23:34:15 科技观察

前言在JavaScript中比较值很简单,只需要使用相等运算符,比如严格相等运算符:'a'==='c';//=>false1===1;//=>true但是对象有结构化数据,比较难比较。在本文中,您将学习如何在JavaScript中正确比较对象。1.引用比较JavaScript提供了3种方法来比较值:严格相等运算符===松散相等运算符==Object.is()函数当使用以上任何一种方法来比较对象时,只有当值的比较结果为真时引用同一个对象实例。这是参照平等。让我们定义对象hero1和hero2并查看引用相等性:consthero1={name:'Batman'};consthero2={name:'Batman'};hero1===hero1;//=>truehero1===hero2;//=>falsehero1==hero1;//=>truehero1==hero2;//=>falseObject.is(hero1,hero1);//=>trueObject.is(hero1,hero2);//=>falsehero1===hero1的计算结果为真,因为两个操作数都指向同一个对象实例hero1。另一方面,hero1===hero2的计算结果为false,因为hero1和hero2是不同的对象实例。有趣的是,hero1和hero2对象的内容是相同的:两个对象都有一个名称属性,其值为“蝙蝠侠”。尽管如此,即使在比较具有相同结构的对象时,hero1===hero2仍然是false。当您想要比较对象引用而不是它们的内容时,引用相等性很有用。但在更多情况下,您希望比较对象的实际内容:例如属性及其值。接下来,让我们看看如何通过内容来比较对象的相等性。2.手动比较按内容比较对象最直接的方法是读取属性并手动比较它们。例如,让我们写一个特殊的函数isHeroEqual()来比较两个英雄对象:'Batman'};consthero3={name:'Joker'};isHeroEqual(hero1,hero2);//=>trueSeroEqual(hero1,hero3);//=>falseisHeroEqual()访问两个对象的属性名称并比较它们值。如果被比较的对象具有某些属性,我更喜欢编写像isHeroEqual()这样的比较函数。这样的函数具有良好的性能:只有少数属性访问器和相等运算符参与比较。手动比较需要手动提取属性,这对于简单的对象不是问题。但是,对于较大对象(或结构未知的对象)的比较,它是不方便的,因为它需要大量的样板代码。因此,让我们看看对象的浅层比较有何帮助。3.浅比较如果用浅比较检查对象,你必须得到两个对象的属性列表(使用Object.keys()),然后检查它们的属性值是否相等。下面的代码是浅比较的一个实现:;}for(letindex=0;indextrueshallowEqual(hero1,hero3);//=>falseshallowEqual(hero1,hero2)返回true,因为对象hero1和hero2具有相同的属性(名称和realName),值也相同。另一方面,由于hero1和hero3具有不同的属性,shallowEqual(hero1,hero3)将返回false。但是JavaScript中的对象是可以嵌套的。在这种情况下,浅层比较效果不佳。下面对带有嵌套对象的对象进行浅比较检查:consthero1={name:'Batman',address:{city:'Gotham'}};consthero2={name:'Batman',address:{city:'Gotham'}};shallowEqual(hero1,hero2);//=>false这一次,shallowEqual(hero1,hero2)将返回false,即使两个对象hero1和hero2具有相同的内容。发生这种情况是因为嵌套对象hero1.address和hero2.address是不同的对象实例。因此,浅比较认为hero1.address和hero2.address是两个不同的值。解决嵌套对象的问题需要深度比较。4.深度比较深度比较类似于浅层比较,只是当对象包含在属性中时,对嵌套对象进行递归浅层比较。看一下深度比较的实现:false;}for(letindex=0;indextrue深度比较函数可以正确判断hero1和hero2是否具有相同的属性和值,包括嵌套对象hero1.address和hero2.address是否相等。为了深入比较对象,我建议使用isDeepStrictEqual(object1,object2)(https://nodejs.org/api/util.html#util_util_isdeepstrictequal_val1_val2)来自Node的内置util模块或_.isEqual(object1,object2)来自lodash库(https://lodash.com/docs/4.17.15#isEqual)。5.总结引用相等性(使用===、==或Object.is())用于判断操作数是否为同一个对象实例。手动检查对象是否相等需要手动比较属性值。虽然这种类型的检查需要手动编码来比较属性,但由于它的简单性,所以很方便。当被比较的对象具有许多属性或对象的结构在运行时确定时,更好的方法是使用浅层检查。如果被比较的对象有嵌套对象,则应该进行深度比较检查。