JavaScript中对象的比较

问题描述:  

  在JavaScript中,数值的比较是比较简单的,使用相等(==)和全等(===)符号基本上可以解决大多数非对象的比较;但是相等(==)和全等(===)符号在对象 object 的比较上,就不能满足所有的要求了,如下面的代码:

 1 let obj_a = {
 2 name: "jack",
 3     old: 12
 4 }
 5
 6 let obj_b = {
 7     name: "lucy",
 8     old: 13
 9 }
10
11 let obj_c = {
12     name: "lucy",
13     old: 13
14 }
15
16 let obj_d = obj_b
17
18 console.log(obj_a === obj_b) // false
19 console.log(obj_b === obj_c) // false
20 console.log(obj_b === obj_d) // true

  上面代码中 obj_b 和 obj_c 是不等的,但是和 obj_d 是相等的,这是因为全等符号 === 在比较对象的时候,比较的是对象的地址,换句话来说:全等符号判断的是两个对象是否是一个对象,而不能判断两个对象是否数值相等,事实上,在大多数情况下,使用全等符号去判断两个对象返回的均是 false

解决方法:

  那如果需要判断两个对象在字面意义上是否相等,该才去什么样的操作?答案是遍历两个对象,然后在一一比较 key-value 对;为了方便使用,可以将比较的方法抽象成为下面的函数:

 1 // 判断对象相等(数值表现)的函数
 2 // 如果 a, b相等,则返回 true,否则返回 false
 3 const isObjectValueEqual = (a, b) => {
 4     // Object.getOwnPropertyNames()方法返回一个由指定对象的所有自身属性的属性名(包括不可枚举属性但不包括Symbol值作为名称的属性)组成的数组
 5     // 换句话来说 Object.getOwnPropertyNames()方法返回的是对象所有 key 组成的数组 list
 6     var aProps = Object.getOwnPropertyNames(a);
 7     var bProps = Object.getOwnPropertyNames(b);
 8     if (aProps.length != bProps.length) {
 9         return false;
10     }
11
12     for (var i = 0; i < aProps.length; i++) {
13         var propName = aProps[i];
14         if (a[propName] !== b[propName]) {
15             return false;
16         }
17     }
18     return true;
19 }
20
21 // 判断一个对象是否存在于数组(该数组由对象所组成)中的函数
22 // 如果 obj 对象存在于 list 数组中,则返回 true,否则返回 false
23 const isObjectListValueEqual = (list, obj) => {
24     for (let i = 0, len = list.length; i < len; i++) {
25         if (isObjectValueEqual(list[i], obj)) {
26             return true
27         }
28     }
29     return false
30 }
31
32 // 判断一个数组(该数组由对象所组成)中每个对象是否是不重复的(值)
33 // 如果 list 数组中没有重复的对象,则返回 true,否则返回 false
34 const isJudgeObjectListValueSingle = (list) => {
35     let receive = list
36     for (let i = 0, len = receive.length; i < len; i++) {
37         let temp = receive[i]
38         let aim = receive.slice(i + 1, len)
39         if (isObjectListValueEqual(aim, temp)) {
40             return false
41         }
42     }
43     return true
44 }

结论:

  1)===主要用于判断对象是否是同一个对象,而不能用来判断两个存储地址不一致的对象在属性上是否完全相等

  2)判断存储地址不一致的对象在属性上是否完全相等可以使用如上函数

  3)普通变量可以使用 set 集合的方法方便地去重,但是对象变量是不能的(这点可以自己验证)

  

原文地址:https://www.cnblogs.com/oulae/p/10777117.html

时间: 2024-10-04 15:34:30

JavaScript中对象的比较的相关文章

JavaScript中对象类型的转换小结

对象到字符串和对象到数字类型的转换涉及到两个重要的方法,最终的转换结果会受到这两个方法返回结果的影响,这两个方法就是toString和valueOf.所有的对象都会从Object对象中继承到这两个方法.toString方法 用于返回对象的字符串表示(但是其实也可以不返回字符串).对于默认从Object继承而来的toString方法并不会返回太多有意义的内容.而valueOf方法目的是返回一个可以表示对象的原始类型值,但是由于对象的复杂性,大多数情况下根本不可能用一个原始类型值来表示,所以默认的v

JavaScript中对象属性的添加和删除

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <script type="text/javascript"> /* * 用.为对象添加属性 用关键字delete删除属性 用[]添加属性 和.的不同 r.name==r["name"]; r.

私人定制javascript中对象小知识点(Only For Me)

废话不多讲,先上笑话,然后再,.看懂这个的说明你的节操已经不再了. 晚饭后去理发店理发...割了吧...老板问我怎么剪,我悠悠的来一句往帅了剪...高潮往往令人想不到....旁边一在焗油烫头发的大妈说到 别这样为难老板,人家赚点钱不容易...首先如果你是高手那么请出门右转,如果你是菜鸟那么恭喜你,go on吧 全局对象在javascript程序中任何位置,都可以拈来就用的这种东西,是全局对象的属性.那么属性所在的对象也就是全局对象了.当javascript解释器启动时(或者任何Web浏览器加载新

javascript中对象访问自身属性的方式

在javascript中,通过对象的方法访问对象自身属性时,必须采用this.fieldName的方式. 原因是javascript中Function是无状态的,访问对象的属性时,必须指定当前的上下文状态,即添加this关键字.如果没有指定,则上下文默认为window. 举例如下: 1 var obj = 2 { 3 name:"James", 4 showName:function(){ 5 alert(name); 6 } 7 } 通过控制台执行obj.showName() 输出为

JavaScript中对象的属性

原文:http://www.2ality.com/2012/10/javascript-properties.html JavaScript中有三种不同类型的属性:命名数据属性(named data properties),命名访问器属性(named accessor properties)以及内部属性(internal properties). 命名数据属性 这种属性就是我们通常所用的"普通"属性,它用来将一个字符串名称映射到某个值上.比如,下面的对象obj有一个名为字符串"

五、Javascript中对象

为什么面向对象的思想能迅速风靡编程世界呢? 因为面向对象的思想首次把数据和代码结合成统一体,并以一个简单的对象概念呈现给编程者.这一下子就将原来那些杂乱的算法与子程序,以及纠缠不清的复杂数据结构,划分成清晰而有序的结构对象,从而理清了数据与代码在我们心中那团乱麻般的结. 在JavaScript中,一切皆可看做是对象来进行处理. 一.定义得到一个对象 除了上面直接定义的方式得到对象外,还可以使用构造方法来得到对象. 二.对象属性和方法的访问 1.方式一:通过 对象名.属性名 .对象名.方法名( )

JavaScript中对象的浅复制和深复制

在JavaScript中,如果要复制一个变量我们应该怎么做呢?下面这种做法是最简单的一种形式: //把a复制给b let a = 12; let b = a; 这种复制方法只能适用于基本类型,如果a是对象怎么办呢?我们先来看看上面的代码在内存中做了什么事: 声明了变量a = 12,栈内存会分配一块区域来存储,如上图所示.把a赋给b,会在栈中重新开辟一块区域来存储b,并且b的值就是a的值. 假如a是对象,内存做了什么事呢?来看下面的例子: let a = {}; let b = a; 如图所示,对

javascript中对象的深度克隆

零.寒暄 又是一个月多月没有更新博客了,这段时间回学校处理下论文的事情,实习的生活也暂时告一段落(在公司上班,才发现学校里面的生活简直如天堂一般,相信很多已经毕业的小伙伴肯定被我说中了,说中了请给本文点个赞,哈哈!).希望接下来自己的更新进度能加快,马上又是一年校招时,被虐也好.大牛虐别人也罢,总之祝福各位今年要找工作的小伙伴们好运.那么,今天就聊一下一个常见的笔试.面试题,js中对象的深度克隆.翻了下这个题目,在很多地方出现过,已经算一个老的题目了,但是每年的校招中总会考到,其实想想,这个题目

javascript中对象学习

第一篇文章: javascript中this关键字的详细解析:   http://blog.csdn.net/wyj880220/article/details/7305952 <其它文章 待补充……>