比较没有对象参考Angular 10的两个对象

Question

我想比较两个对象，看看它们是否相等。对象A(offer(是原始对象，对象B(offerTemp(是A的副本。

对象A显示在组件的表中，查看表中是否有任何更改。我想将A与B进行比较。但当我调用函数检查它们是否相等时，它会显示对象不相等。我认为这是因为对象A有对象的引用，而B没有(至少当我在控制台中记录这两个对象时，我看到了这一点(。

对象A(报价((来自控制台(：

Offer {id: 1834, title: "A great article offer - 1834", description: "browser", sellDate: Mon Dec 25 2045 21:54:06 GMT+0100 (Central European Standard Time), valueHighestBid: 753, …}

对象B(offerTemp((来自控制台(：

{id: 1834, title: "A great article offer - 1834", description: "browser", sellDate: Mon Dec 25 2045 21:54:06 GMT+0100 (Central European Standard Time), valueHighestBid: 753, …}

这来自component.ts:

ngOnInit(): void {
this.offer = this.offerService.FindById(this.editOfferId);
this.offerTemp = Object.assign({}, this.offer);
}
cancelSelected(offer: Offer): void{
if (offer === this.offerTemp) {
// do stuff...
}
else {
console.log(this.offer === this.offerTemp); // false in the console
console.log(this.offer);
console.log(this.offerTemp);
}
}

这是我的html:中的部分

<div>
<table>
<tr> 
<th>Selected offer details: (id: {{offer.id}})</th>
</tr>
<tr>
<td>Title</td>
<td>
<input [(ngModel)]="offer.title" type="text" name="" id="">
</td>
</tr>
<tr>
<td>description</td>
<td>
<input [(ngModel)]="offer.description" type="text" name="" id="">
</td>
</tr>
<tr>
<td>auctionStatus</td>
<td>
<select>
<option *ngFor="let key of keys" [value]="key" [selected]="offer.auctionStatus">{{statusen[key]}}</option>
</select>
</td>
</tr>
<tr>
<td>valueHighestBid</td>
<td>
<input [(ngModel)]="offer.valueHighestBid" type="text" name="" id="">
</td>
</tr>
</table>
<button mat-raised-button (click)="deleteSelected()"> Delete </button>
<button mat-raised-button (click)="saveSelected(offer)"> Save </button>
<button mat-raised-button (click)="clearSelected(offer)" > Clear </button>
<button mat-raised-button (click)="resetSelected(offer)" > Reset </button>
<button mat-raised-button (click)="cancelSelected(offer)"> Cancel </button>

</div>

有没有任何方法可以在没有对象引用的情况下比较这些对象，或者我可以用其他方法解决这个问题？

Answer 1

JavaScript没有用于对象和数组的内置属性相等运算符。

检查对象是否相等的一种简单方法是使用JSON.stringify:

JSON.stringify(objectA) === JSON.stringify(objectB);

这将把对象转换成字符串，并使其易于比较。当对象嵌套时，这种方法也能很好地工作。

另一种选择是使用equals方法(或者更好的是，也适用于嵌套对象的深度equal方法(，迭代所有对象的属性并比较它们的值。

Answer 2

只有当两个变量是对同一对象的引用时，使用三个等号===的两个对象的比较才会返回true。你显然不想那样。

您要么需要创建自己的比较对象的方法，要么使用一些提供对象深度比较的javascript库，如lodash:中的_.isEqual

let object = { 'a': 1 };
let other = { 'a': 1 };

_.isEqual(object, other);
// => true

object === other;
// => false