提问人:spankmaster79 提问时间:7/1/2009 最后编辑:Mattspankmaster79 更新时间:6/17/2020 访问量:1423167
JavaScript 中的对象比较 [duplicate]
Object comparison in JavaScript [duplicate]
问:
在 JavaScript 中比较对象的最佳方法是什么?
例:
var user1 = {name : "nerd", org: "dev"};
var user2 = {name : "nerd", org: "dev"};
var eq = user1 == user2;
alert(eq); // gives false
我知道如果两个对象引用完全相同的对象,它们是相等的,但是有没有办法检查它们是否具有相同的属性值?
以下方式对我有用,但这是唯一的可能性吗?
var eq = Object.toJSON(user1) == Object.toJSON(user2);
alert(eq); // gives true
答:
当然不是唯一的方法 - 您可以制作一个方法原型(这里针对 Object,但我当然不建议将 Object 用于实时代码)来复制 C#/Java 样式比较方法。
编辑,因为似乎可以预期一个一般示例:
Object.prototype.equals = function(x)
{
for(p in this)
{
switch(typeof(this[p]))
{
case 'object':
if (!this[p].equals(x[p])) { return false }; break;
case 'function':
if (typeof(x[p])=='undefined' || (p != 'equals' && this[p].toString() != x[p].toString())) { return false; }; break;
default:
if (this[p] != x[p]) { return false; }
}
}
for(p in x)
{
if(typeof(this[p])=='undefined') {return false;}
}
return true;
}
请注意,使用 toString() 测试方法绝对不够好,但是由于空格有意义与否的问题,一个可以接受的方法非常困难,更不用说同义词方法和方法在不同的实现中产生相同的结果。以及针对 Object 进行原型设计的问题。
如果要显式检查方法,可以使用 method.toSource() 或 method.toString() 方法。
评论
toSource
不幸的是,没有完美的方法,除非你递归使用并访问所有不可枚举的属性,但这仅适用于 Firefox。_proto_
所以我能做的最好的事情就是猜测使用场景。
1)快速且有限。
当您内部有没有方法和 DOM 节点的简单 JSON 样式对象时,可以工作:
JSON.stringify(obj1) === JSON.stringify(obj2)
属性的 ORDER 很重要,因此此方法将对以下对象返回 false:
x = {a: 1, b: 2};
y = {b: 2, a: 1};
2)缓慢且更通用。
在不深入研究原型的情况下比较对象,然后递归比较属性的投影,并比较构造函数。
这几乎是正确的算法:
function deepCompare () {
var i, l, leftChain, rightChain;
function compare2Objects (x, y) {
var p;
// remember that NaN === NaN returns false
// and isNaN(undefined) returns true
if (isNaN(x) && isNaN(y) && typeof x === 'number' && typeof y === 'number') {
return true;
}
// Compare primitives and functions.
// Check if both arguments link to the same object.
// Especially useful on the step where we compare prototypes
if (x === y) {
return true;
}
// Works in case when functions are created in constructor.
// Comparing dates is a common scenario. Another built-ins?
// We can even handle functions passed across iframes
if ((typeof x === 'function' && typeof y === 'function') ||
(x instanceof Date && y instanceof Date) ||
(x instanceof RegExp && y instanceof RegExp) ||
(x instanceof String && y instanceof String) ||
(x instanceof Number && y instanceof Number)) {
return x.toString() === y.toString();
}
// At last checking prototypes as good as we can
if (!(x instanceof Object && y instanceof Object)) {
return false;
}
if (x.isPrototypeOf(y) || y.isPrototypeOf(x)) {
return false;
}
if (x.constructor !== y.constructor) {
return false;
}
if (x.prototype !== y.prototype) {
return false;
}
// Check for infinitive linking loops
if (leftChain.indexOf(x) > -1 || rightChain.indexOf(y) > -1) {
return false;
}
// Quick checking of one object being a subset of another.
// todo: cache the structure of arguments[0] for performance
for (p in y) {
if (y.hasOwnProperty(p) !== x.hasOwnProperty(p)) {
return false;
}
else if (typeof y[p] !== typeof x[p]) {
return false;
}
}
for (p in x) {
if (y.hasOwnProperty(p) !== x.hasOwnProperty(p)) {
return false;
}
else if (typeof y[p] !== typeof x[p]) {
return false;
}
switch (typeof (x[p])) {
case 'object':
case 'function':
leftChain.push(x);
rightChain.push(y);
if (!compare2Objects (x[p], y[p])) {
return false;
}
leftChain.pop();
rightChain.pop();
break;
default:
if (x[p] !== y[p]) {
return false;
}
break;
}
}
return true;
}
if (arguments.length < 1) {
return true; //Die silently? Don't know how to handle such case, please help...
// throw "Need two or more arguments to compare";
}
for (i = 1, l = arguments.length; i < l; i++) {
leftChain = []; //Todo: this can be cached
rightChain = [];
if (!compare2Objects(arguments[0], arguments[i])) {
return false;
}
}
return true;
}
已知问题(好吧,它们的优先级非常低,可能您永远不会注意到它们):
- 具有不同原型结构但相同投影的对象
- 函数可能具有相同的文本,但引用不同的闭包
测试:通过测试来自如何确定两个 JavaScript 对象的相等性?。
评论
undefined
undefined
in
typeof
p in x
$.proxy
Function#bind
===
{ a: 5 }
{ a: "5.0" }
for(var key in someObject)
if(!someObject.hasOwnProperty(key)) continue;
this[p] === x[p]
false
JSON.stringify
如果你在没有 JSON 库的情况下工作,也许这会帮助你:
Object.prototype.equals = function(b) {
var a = this;
for(i in a) {
if(typeof b[i] == 'undefined') {
return false;
}
if(typeof b[i] == 'object') {
if(!b[i].equals(a[i])) {
return false;
}
}
if(b[i] != a[i]) {
return false;
}
}
for(i in b) {
if(typeof a[i] == 'undefined') {
return false;
}
if(typeof a[i] == 'object') {
if(!a[i].equals(b[i])) {
return false;
}
}
if(a[i] != b[i]) {
return false;
}
}
return true;
}
var a = {foo:'bar', bar: {blub:'bla'}};
var b = {foo:'bar', bar: {blub:'blob'}};
alert(a.equals(b)); // alert's a false
评论
我对上面的代码进行了一些修改。对我来说 0 !== false 和 null !== 未定义。如果您不需要如此严格的检查,请删除代码中“this[p] !== x[p]”中的一个“=”符号。
Object.prototype.equals = function(x){
for (var p in this) {
if(typeof(this[p]) !== typeof(x[p])) return false;
if((this[p]===null) !== (x[p]===null)) return false;
switch (typeof(this[p])) {
case 'undefined':
if (typeof(x[p]) != 'undefined') return false;
break;
case 'object':
if(this[p]!==null && x[p]!==null && (this[p].constructor.toString() !== x[p].constructor.toString() || !this[p].equals(x[p]))) return false;
break;
case 'function':
if (p != 'equals' && this[p].toString() != x[p].toString()) return false;
break;
default:
if (this[p] !== x[p]) return false;
}
}
return true;
}
然后我用下面的对象测试了它:
var a = {a: 'text', b:[0,1]};
var b = {a: 'text', b:[0,1]};
var c = {a: 'text', b: 0};
var d = {a: 'text', b: false};
var e = {a: 'text', b:[1,0]};
var f = {a: 'text', b:[1,0], f: function(){ this.f = this.b; }};
var g = {a: 'text', b:[1,0], f: function(){ this.f = this.b; }};
var h = {a: 'text', b:[1,0], f: function(){ this.a = this.b; }};
var i = {
a: 'text',
c: {
b: [1, 0],
f: function(){
this.a = this.b;
}
}
};
var j = {
a: 'text',
c: {
b: [1, 0],
f: function(){
this.a = this.b;
}
}
};
var k = {a: 'text', b: null};
var l = {a: 'text', b: undefined};
a==b 预期为真;返回 true
a==c 预期为 false;返回 false
c==d 预期为 false;返回 false
a==e 预期为 false;返回 false
f==g 预期为 true;返回 true
h==g 预期为 false;返回 false
i==j 预期为真;返回 true
d==k 预期为 false;返回 false
k==l 预期为 false;返回 false
评论
我写了这段代码来比较对象,它似乎有效。检查断言:
function countProps(obj) {
var count = 0;
for (k in obj) {
if (obj.hasOwnProperty(k)) {
count++;
}
}
return count;
};
function objectEquals(v1, v2) {
if (typeof(v1) !== typeof(v2)) {
return false;
}
if (typeof(v1) === "function") {
return v1.toString() === v2.toString();
}
if (v1 instanceof Object && v2 instanceof Object) {
if (countProps(v1) !== countProps(v2)) {
return false;
}
var r = true;
for (k in v1) {
r = objectEquals(v1[k], v2[k]);
if (!r) {
return false;
}
}
return true;
} else {
return v1 === v2;
}
}
assert.isTrue(objectEquals(null,null));
assert.isFalse(objectEquals(null,undefined));
assert.isTrue(objectEquals("hi","hi"));
assert.isTrue(objectEquals(5,5));
assert.isFalse(objectEquals(5,10));
assert.isTrue(objectEquals([],[]));
assert.isTrue(objectEquals([1,2],[1,2]));
assert.isFalse(objectEquals([1,2],[2,1]));
assert.isFalse(objectEquals([1,2],[1,2,3]));
assert.isTrue(objectEquals({},{}));
assert.isTrue(objectEquals({a:1,b:2},{a:1,b:2}));
assert.isTrue(objectEquals({a:1,b:2},{b:2,a:1}));
assert.isFalse(objectEquals({a:1,b:2},{a:1,b:3}));
assert.isTrue(objectEquals({1:{name:"mhc",age:28}, 2:{name:"arb",age:26}},{1:{name:"mhc",age:28}, 2:{name:"arb",age:26}}));
assert.isFalse(objectEquals({1:{name:"mhc",age:28}, 2:{name:"arb",age:26}},{1:{name:"mhc",age:28}, 2:{name:"arb",age:27}}));
assert.isTrue(objectEquals(function(x){return x;},function(x){return x;}));
assert.isFalse(objectEquals(function(x){return x;},function(y){return y+2;}));
评论
这是我的版本,这个线程中的很多东西都集成在一起(测试用例的计数相同):
Object.defineProperty(Object.prototype, "equals", {
enumerable: false,
value: function (obj) {
var p;
if (this === obj) {
return true;
}
// some checks for native types first
// function and sring
if (typeof(this) === "function" || typeof(this) === "string" || this instanceof String) {
return this.toString() === obj.toString();
}
// number
if (this instanceof Number || typeof(this) === "number") {
if (obj instanceof Number || typeof(obj) === "number") {
return this.valueOf() === obj.valueOf();
}
return false;
}
// null.equals(null) and undefined.equals(undefined) do not inherit from the
// Object.prototype so we can return false when they are passed as obj
if (typeof(this) !== typeof(obj) || obj === null || typeof(obj) === "undefined") {
return false;
}
function sort (o) {
var result = {};
if (typeof o !== "object") {
return o;
}
Object.keys(o).sort().forEach(function (key) {
result[key] = sort(o[key]);
});
return result;
}
if (typeof(this) === "object") {
if (Array.isArray(this)) { // check on arrays
return JSON.stringify(this) === JSON.stringify(obj);
} else { // anyway objects
for (p in this) {
if (typeof(this[p]) !== typeof(obj[p])) {
return false;
}
if ((this[p] === null) !== (obj[p] === null)) {
return false;
}
switch (typeof(this[p])) {
case 'undefined':
if (typeof(obj[p]) !== 'undefined') {
return false;
}
break;
case 'object':
if (this[p] !== null
&& obj[p] !== null
&& (this[p].constructor.toString() !== obj[p].constructor.toString()
|| !this[p].equals(obj[p]))) {
return false;
}
break;
case 'function':
if (this[p].toString() !== obj[p].toString()) {
return false;
}
break;
default:
if (this[p] !== obj[p]) {
return false;
}
}
};
}
}
// at least check them with JSON
return JSON.stringify(sort(this)) === JSON.stringify(sort(obj));
}
});
这是我的测试用例:
assertFalse({}.equals(null));
assertFalse({}.equals(undefined));
assertTrue("String", "hi".equals("hi"));
assertTrue("Number", new Number(5).equals(5));
assertFalse("Number", new Number(5).equals(10));
assertFalse("Number+String", new Number(1).equals("1"));
assertTrue([].equals([]));
assertTrue([1,2].equals([1,2]));
assertFalse([1,2].equals([2,1]));
assertFalse([1,2].equals([1,2,3]));
assertTrue(new Date("2011-03-31").equals(new Date("2011-03-31")));
assertFalse(new Date("2011-03-31").equals(new Date("1970-01-01")));
assertTrue({}.equals({}));
assertTrue({a:1,b:2}.equals({a:1,b:2}));
assertTrue({a:1,b:2}.equals({b:2,a:1}));
assertFalse({a:1,b:2}.equals({a:1,b:3}));
assertTrue({1:{name:"mhc",age:28}, 2:{name:"arb",age:26}}.equals({1:{name:"mhc",age:28}, 2:{name:"arb",age:26}}));
assertFalse({1:{name:"mhc",age:28}, 2:{name:"arb",age:26}}.equals({1:{name:"mhc",age:28}, 2:{name:"arb",age:27}}));
assertTrue("Function", (function(x){return x;}).equals(function(x){return x;}));
assertFalse("Function", (function(x){return x;}).equals(function(y){return y+2;}));
var a = {a: 'text', b:[0,1]};
var b = {a: 'text', b:[0,1]};
var c = {a: 'text', b: 0};
var d = {a: 'text', b: false};
var e = {a: 'text', b:[1,0]};
var f = {a: 'text', b:[1,0], f: function(){ this.f = this.b; }};
var g = {a: 'text', b:[1,0], f: function(){ this.f = this.b; }};
var h = {a: 'text', b:[1,0], f: function(){ this.a = this.b; }};
var i = {
a: 'text',
c: {
b: [1, 0],
f: function(){
this.a = this.b;
}
}
};
var j = {
a: 'text',
c: {
b: [1, 0],
f: function(){
this.a = this.b;
}
}
};
var k = {a: 'text', b: null};
var l = {a: 'text', b: undefined};
assertTrue(a.equals(b));
assertFalse(a.equals(c));
assertFalse(c.equals(d));
assertFalse(a.equals(e));
assertTrue(f.equals(g));
assertFalse(h.equals(g));
assertTrue(i.equals(j));
assertFalse(d.equals(k));
assertFalse(k.equals(l));
评论
Utils.compareObjects = function(o1, o2){
for(var p in o1){
if(o1.hasOwnProperty(p)){
if(o1[p] !== o2[p]){
return false;
}
}
}
for(var p in o2){
if(o2.hasOwnProperty(p)){
if(o1[p] !== o2[p]){
return false;
}
}
}
return true;
};
比较 ONE-LEVEL only 对象的简单方法。
评论
以下算法将处理自引用数据结构、数字、字符串、日期,当然还有纯嵌套的 javascript 对象:
在以下情况下,对象被视为等效对象
- 它们完全相等(首先解开 String 和 Number 以确保等效于
===
42
Number(42)
) - 或者它们都是日期并且具有相同的日期
valueOf()
- 或者它们都是同一类型,而不是 null 和...
- 它们不是对象,并且相等(捕获数字/字符串/布尔值)
==
- 或者,忽略具有值的属性,它们具有相同的属性,所有这些属性都被认为是递归等价的。
undefined
- 它们不是对象,并且相等(捕获数字/字符串/布尔值)
函数文本不认为函数相同。此测试是不够的,因为函数可能具有不同的闭包。只有当这样说时,函数才被认为是相等的(但如果你选择这样做,你可以很容易地扩展这种等价关系)。===
避免了可能由循环数据结构引起的无限循环。当试图反驳相等性并递归到对象的属性中时,它会跟踪需要此子比较的对象。如果可以反驳相等性,那么对象之间就存在一些可到达的属性路径,然后必须有一个最短的可到达路径,并且该最短的可到达路径不能包含两条路径中都存在的循环;即,在递归比较对象时可以假设相等。假设存储在一个属性中,该属性在使用后被删除,但如果对象图已包含此类属性,则行为是未定义的。使用这样的标记属性是必要的,因为 javascript 不支持使用任意对象作为键的字典。areEquivalent
areEquivalent_Eq_91_2_34
function unwrapStringOrNumber(obj) {
return (obj instanceof Number || obj instanceof String
? obj.valueOf()
: obj);
}
function areEquivalent(a, b) {
a = unwrapStringOrNumber(a);
b = unwrapStringOrNumber(b);
if (a === b) return true; //e.g. a and b both null
if (a === null || b === null || typeof (a) !== typeof (b)) return false;
if (a instanceof Date)
return b instanceof Date && a.valueOf() === b.valueOf();
if (typeof (a) !== "object")
return a == b; //for boolean, number, string, xml
var newA = (a.areEquivalent_Eq_91_2_34 === undefined),
newB = (b.areEquivalent_Eq_91_2_34 === undefined);
try {
if (newA) a.areEquivalent_Eq_91_2_34 = [];
else if (a.areEquivalent_Eq_91_2_34.some(
function (other) { return other === b; })) return true;
if (newB) b.areEquivalent_Eq_91_2_34 = [];
else if (b.areEquivalent_Eq_91_2_34.some(
function (other) { return other === a; })) return true;
a.areEquivalent_Eq_91_2_34.push(b);
b.areEquivalent_Eq_91_2_34.push(a);
var tmp = {};
for (var prop in a)
if(prop != "areEquivalent_Eq_91_2_34")
tmp[prop] = null;
for (var prop in b)
if (prop != "areEquivalent_Eq_91_2_34")
tmp[prop] = null;
for (var prop in tmp)
if (!areEquivalent(a[prop], b[prop]))
return false;
return true;
} finally {
if (newA) delete a.areEquivalent_Eq_91_2_34;
if (newB) delete b.areEquivalent_Eq_91_2_34;
}
}
评论
这是我的 ES3 注释解决方案(代码后面的血腥细节):
function object_equals( x, y ) {
if ( x === y ) return true;
// if both x and y are null or undefined and exactly the same
if ( ! ( x instanceof Object ) || ! ( y instanceof Object ) ) return false;
// if they are not strictly equal, they both need to be Objects
if ( x.constructor !== y.constructor ) return false;
// they must have the exact same prototype chain, the closest we can do is
// test there constructor.
for ( var p in x ) {
if ( ! x.hasOwnProperty( p ) ) continue;
// other properties were tested using x.constructor === y.constructor
if ( ! y.hasOwnProperty( p ) ) return false;
// allows to compare x[ p ] and y[ p ] when set to undefined
if ( x[ p ] === y[ p ] ) continue;
// if they have the same strict value or identity then they are equal
if ( typeof( x[ p ] ) !== "object" ) return false;
// Numbers, Strings, Functions, Booleans must be strictly equal
if ( ! object_equals( x[ p ], y[ p ] ) ) return false;
// Objects and Arrays must be tested recursively
}
for ( p in y )
if ( y.hasOwnProperty( p ) && ! x.hasOwnProperty( p ) )
return false;
// allows x[ p ] to be set to undefined
return true;
}
在开发这个解决方案时,我特别关注了极端情况、效率,但试图产生一个简单的解决方案,希望能有一些优雅。JavaScript 允许 null 和 undefined 属性,并且对象具有原型链,如果不选中,可能会导致非常不同的行为。
首先,我选择不扩展 Object.prototype,主要是因为 null 不能是比较的对象之一,并且我认为 null 应该是一个有效的对象,可以与另一个对象进行比较。其他人还注意到了关于Object.prototype扩展的其他合理担忧,这些担忧可能对他人的代码产生副作用。
必须特别注意处理 JavaScript 允许对象属性设置为 undefined 的可能性,即存在值设置为 undefined 的属性。上述解决方案验证两个对象是否具有相同的属性,这些属性设置为 undefined 以报告相等性。这只能通过使用 Object.hasOwnProperty( property_name ) 检查属性是否存在来实现。另请注意,JSON.stringify() 删除设置为 undefined 的属性,因此使用此表单的比较将忽略设置为 undefined 值的属性。
只有当函数共享相同的引用时,它们才应该被认为是相等的,而不仅仅是相同的代码,因为这不会考虑这些函数原型。因此,比较代码字符串并不能保证它们具有相同的原型对象。
这两个对象应该具有相同的原型链,而不仅仅是相同的属性。这只能通过比较两个对象的构造函数来跨浏览器进行测试,以实现严格的相等性。ECMAScript 5 允许使用 Object.getPrototypeOf() 测试他们的实际原型。一些 Web 浏览器还提供执行相同操作的__proto__属性。对上述代码的可能改进将允许在可用时使用这些方法之一。
在这里,严格比较的使用至关重要,因为不应将 2 视为等于“2.0000”,也不应将 false 视为等于 null、undefined 或 0。
出于效率考虑,我尽快比较了属性的平等性。然后,仅当失败时,才查找这些属性的类型。对于具有大量标量属性的大型物体,速度提升可能非常显著。
不再需要两个循环,第一个循环用于检查左侧对象的属性,第二个用于检查右侧对象的属性并仅验证是否存在(而不是值),以捕获这些使用未定义值定义的属性。
总的来说,这段代码只用了 16 行代码(没有注释)就处理了大多数极端情况。
更新(2015 年 8 月 13 日)。我已经实现了一个更好的版本,因为函数 value_equals() 速度更快,可以正确处理极端情况,例如 NaN 和 0 不同于 -0,可以选择强制执行对象的属性顺序和循环引用测试,作为 Toubkal 项目测试套件的一部分,由 100 多个自动化测试提供支持。
评论
equal()
isEqual
_.isEqual( obj1 , obj2 )