在JS中判斷兩個對象是否相等方法詳解
嚴(yán)格相等運(yùn)算符 (===)
使用 === 運(yùn)算符可以比較兩個對象是否引用同一個對象。如果兩個變量引用了同一個對象,則它們是相等的,否則它們是不相等的。例如:
const obj1 = { a: 1 };
const obj2 = { a: 1 };
const obj3 = obj1;
console.log(obj1 === obj2); // false
console.log(obj1 === obj3); // true在上面的例子中,obj1 和 obj2 的屬性值相同,但它們是不同的對象,因此它們的 === 比較返回 false。而 obj1 和 obj3 引用了同一個對象,它們是相等的,因此 obj1 === obj3 返回 true。
這里就是嚴(yán)格比較,引用地址和屬性名屬性值都要一一對應(yīng)。
對象屬性的比較
如果你只是需要比較兩個對象的屬性是否相等(不比較引用地址),你可以使用循環(huán)或 Object.keys 方法來獲取對象屬性的列表,并比較它們的值。例如:
function isObjectEqual(obj1, obj2) {
const obj1Keys = Object.keys(obj1);
const obj2Keys = Object.keys(obj2);
if (obj1Keys.length !== obj2Keys.length) {
return false;
}
for (let key of obj1Keys) {
if (obj1[key] !== obj2[key]) {
return false;
}
}
return true;
}
const obj1 = { a: 1, b: "hello" };
const obj2 = { a: 1, b: "world" };
const obj3 = { a: 1, b: "hello" };
console.log(isObjectEqual(obj1, obj2)); // false
console.log(isObjectEqual(obj1, obj3)); // true在上面的例子中,isObjectEqual 函數(shù)比較了 obj1 和 obj2 的屬性值并返回 false,因?yàn)樗鼈兊?b 屬性的值不相等。而 isObjectEqual(obj1, obj3) 返回 true,因?yàn)樗鼈兊乃袑傩灾刀枷嗟取?/p>
使用 Lodash 等工具庫判斷兩個對象是否相等
可以使用 Lodash 的 isEqual 方法(依然不比較引用地址)。isEqual 方法會遞歸比較兩個對象的屬性值是否相等,包括嵌套對象和數(shù)組。
const obj1 = { a: 1, b: { c: 2 } };
const obj2 = { a: 1, b: { c: 2 } };
const obj3 = { a: 1, b: { c: 3 } };
console.log(_.isEqual(obj1, obj2)); // true
console.log(_.isEqual(obj1, obj3)); // false在上面的例子中,_.isEqual(obj1, obj2) 返回 true,因?yàn)樗鼈兊乃袑傩灾刀枷嗟?,包括嵌套的對象。?_.isEqual(obj1, obj3) 返回 false,因?yàn)樗鼈兊?b.c 屬性的值不相等。
JSON.stringify 方法
如果你的對象中只包含簡單類型(如數(shù)字、字符串、布爾值和 null)以及其他對象或數(shù)組,則可以使用 JSON.stringify 方法將對象轉(zhuǎn)換為字符串,然后比較這些字符串(還是不比較引用地址)。例如:
const obj1 = { a: 1, b: "hello", c: true };
const obj2 = { a: 1, b: "hello", c: true };
const obj3 = { a: 1, b: "world", c: true };
console.log(JSON.stringify(obj1) === JSON.stringify(obj2)); // true
console.log(JSON.stringify(obj1) === JSON.stringify(obj3)); // false在上面的例子中,JSON.stringify(obj1) 和 JSON.stringify(obj2) 都返回相同的字符串,因此它們的比較返回 true。而 JSON.stringify(obj1) 和 JSON.stringify(obj3) 返回不同的字符串,因此比較返回 false。
需要注意的是,這種方法只適用于簡單類型和嵌套對象或數(shù)組,因?yàn)樗鼰o法處理對象中包含函數(shù)、正則表達(dá)式和 Date 等類型的情況。
使用 Object.is() 方法
它與 === 運(yùn)算符類似,但是有一些特殊情況,例如 Object.is(+0, -0) 返回 false,而 === 運(yùn)算符返回 true。
const obj1 = { a: 1 };
const obj2 = { a: 1 };
const obj3 = obj1;
console.log(Object.is(obj1, obj2)); // false
console.log(Object.is(obj1, obj3)); // true在上面的例子中,Object.is(obj1, obj2) 返回 false,因?yàn)?nbsp;obj1 和 obj2 是兩個不同的對象,而 Object.is(obj1, obj3) 返回 true,因?yàn)?nbsp;obj1 和 obj3 引用了同一個對象。
到此這篇關(guān)于在JS中判斷兩個對象是否相等方法詳解的文章就介紹到這了,更多相關(guān)JS判斷兩個對象是否相等內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
List the Codec Files on a Computer
List the Codec Files on a Computer...2007-06-06
微信小程序?qū)崿F(xiàn)點(diǎn)餐小程序左側(cè)滑動菜單
這篇文章主要為大家詳細(xì)介紹了微信小程序?qū)崿F(xiàn)點(diǎn)餐小程序左側(cè)滑動菜單,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2022-07-07
JavaScript清空數(shù)組元素的兩種方法簡單比較
這篇文章主要介紹了JavaScript清空數(shù)組元素的兩種方法簡單比較,羅列了幾種常見的情況javascript數(shù)組的方法,并且比較了其中的兩種常見方法,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-07-07
動態(tài)創(chuàng)建按鈕的JavaScript代碼
本文給大家分享一段JS實(shí)例代碼介紹動態(tài)創(chuàng)建按鈕的方法,需要的朋友參考下本文2016-01-01
Javascript控制input輸入時(shí)間格式的方法
這篇文章主要介紹了Javascript控制input輸入時(shí)間格式的方法,涉及鼠標(biāo)事件及正則表達(dá)式的靈活應(yīng)用,需要的朋友可以參考下2015-01-01
微信小程序使用setData修改數(shù)組中單個對象的方法分析
這篇文章主要介紹了微信小程序使用setData修改數(shù)組中單個對象的方法,結(jié)合具體實(shí)例形式分析了setData進(jìn)行數(shù)組修改的相關(guān)操作技巧與注意事項(xiàng),需要的朋友可以參考下2018-12-12
原生JS實(shí)現(xiàn)的跳一跳小游戲完整實(shí)例
這篇文章主要介紹了原生JS實(shí)現(xiàn)的跳一跳小游戲,結(jié)合完整實(shí)例形式分析了javascript實(shí)現(xiàn)跳一跳游戲的原理、實(shí)現(xiàn)步驟與相關(guān)操作技巧,需要的朋友可以參考下2019-01-01

