在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
,因為它們的 b
屬性的值不相等。而 isObjectEqual(obj1, obj3)
返回 true
,因為它們的所有屬性值都相等。
使用 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
,因為它們的所有屬性值都相等,包括嵌套的對象。而 _.isEqual(obj1, obj3)
返回 false
,因為它們的 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ù)組,因為它無法處理對象中包含函數(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
,因為 obj1
和 obj2
是兩個不同的對象,而 Object.is(obj1, obj3)
返回 true
,因為 obj1
和 obj3
引用了同一個對象。
到此這篇關(guān)于在JS中判斷兩個對象是否相等方法詳解的文章就介紹到這了,更多相關(guān)JS判斷兩個對象是否相等內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
javascript運(yùn)動效果實例總結(jié)(放大縮小、滑動淡入、滾動)
這篇文章主要介紹了javascript運(yùn)動效果,結(jié)合實例形式總結(jié)分析JavaScript實現(xiàn)放大縮小、滑動淡入、滾動等效果的方法,需要的朋友可以參考下2016-01-01詳解bootstrap的modal-remote兩種加載方式【強(qiáng)化】
本篇文章主要介紹了詳解bootstrap的modal-remote兩種加載方式【強(qiáng)化】,具有一定的參考價值,有興趣的可以了解一下。2017-01-01JavaScript find()方法及返回數(shù)據(jù)實例
這篇文章主要介紹了JavaScript中的find()方法和返回數(shù)據(jù)的內(nèi)存指向,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下2020-04-04JavaScript精煉之構(gòu)造函數(shù) Constructor及Constructor屬性詳解
對象的constructor屬性用于返回創(chuàng)建該對象的函數(shù),也就是我們常說的構(gòu)造函數(shù),除了創(chuàng)建對象,構(gòu)造函數(shù)(constructor) 還做了另一件有用的事情—自動為創(chuàng)建的新對象設(shè)置了原型對象(prototype object)2015-11-11微信小程序?qū)崿F(xiàn)音頻文件播放進(jìn)度的實例代碼
這篇文章主要介紹了微信小程序?qū)崿F(xiàn)音頻文件播放進(jìn)度的實例代碼,代碼包括對進(jìn)度條的實現(xiàn)及進(jìn)度條的滑動,對大家的工作或?qū)W習(xí)具有一定的參考借鑒價值,需要的朋友可以參考下2020-03-03postman自定義函數(shù)實現(xiàn) 時間函數(shù)的思路詳解
Postman是一款功能強(qiáng)大的網(wǎng)頁調(diào)試與發(fā)送網(wǎng)頁HTTP請求的Chrome插件。這篇文章主要給大家介紹postman自定義函數(shù)實現(xiàn) 時間函數(shù)的思路詳解,感興趣的朋友一起看看吧2019-04-04