基于JavaScript判断两个对象内容是否相等


Posted in Javascript onJanuary 10, 2020

这篇文章主要介绍了基于JavaScript判断两个对象内容是否相等,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下

ES6中有一个方法判断两个对象是否相等,这个方法判断是两个对象引用地址是否一致

let obj1= {
  a: 1
 }
 let obj2 = {
  a: 1
 }
console.log(Object.is(obj1, obj2)) // false

let obj3 = obj1
console.log(Object.is(obj1, obj3)) // trueconsole.log(Object.is(obj2, obj3)) // false

当需求是比较两个对象内容是否一致时就没用了。

想要比较两个对象内容是否一致,思路是要遍历对象的所有键名和键值是否都一致:

1、判断两个对象是否指向同一内存

2、使用Object.getOwnPropertyNames获取对象所有键名数组

3、判断两个对象的键名数组是否相等

4、遍历键名,判断键值是否都相等

let obj1 = {
  a: 1,
  b: {
   c: 2
  }
 }
 let obj2 = {
  b: {
   c: 3
  },
  a: 1
 }
 function isObjectValueEqual(a, b) {
  // 判断两个对象是否指向同一内存,指向同一内存返回true
  if (a === b) return true
  // 获取两个对象键值数组
  let aProps = Object.getOwnPropertyNames(a)
  let bProps = Object.getOwnPropertyNames(b)
  // 判断两个对象键值数组长度是否一致,不一致返回false
  if (aProps.length !== bProps.length) return false
  // 遍历对象的键值
  for (let prop in a) {
   // 判断a的键值,在b中是否存在,不存在,返回false
   if (b.hasOwnProperty(prop)) {
    // 判断a的键值是否为对象,是则递归,不是对象直接判断键值是否相等,不相等返回false
    if (typeof a[prop] === 'object') {
     if (!isObjectValueEqual(a[prop], b[prop])) return false
    } else if (a[prop] !== b[prop]) {
     return false
    }
   } else {
    return false
   }
  }
  return true
 }
 console.log(isObjectValueEqual(obj1, obj2)) // false

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
IE浏览器PNG图片透明效果代码
Sep 02 Javascript
jQuery 点击图片跳转上一张或下一张功能的实现代码
Mar 12 Javascript
js Function类型
Dec 04 Javascript
javascript中关于break,continue的特殊用法与介绍
May 24 Javascript
javascript向后台传送相同属性的参数即数组参数
Feb 17 Javascript
AngularJS ng-repeat数组有重复值的解决方法
Oct 23 Javascript
基于Javascript实现的不重复ID的生成器
Dec 25 Javascript
详解PHP中pathinfo()函数导致的安全问题
Jan 05 Javascript
layui之select的option叠加问题的解决方法
Mar 08 Javascript
JavaScript学习笔记之基于定时器实现图片无缝滚动功能详解
Jan 09 Javascript
微信小程序简单的canvas裁剪图片功能详解
Jul 12 Javascript
Node.js实现断点续传
Jun 23 Javascript
jQuery操作事件完整实例分析
Jan 10 #jQuery
jQuery操作元素追加内容示例
Jan 10 #jQuery
基于JS判断对象是否是数组
Jan 10 #Javascript
JS数组属性去重并校验重复数据
Jan 10 #Javascript
JS图片懒加载的优点及实现原理
Jan 10 #Javascript
jQuery操作元素的内容和样式完整实例分析
Jan 10 #jQuery
jquery选择器和属性对象的操作实例分析
Jan 10 #jQuery
You might like
使用php重新实现PHP脚本引擎内置函数
2007/03/06 PHP
10 个经典PHP函数
2013/10/17 PHP
PHP使用PHPMailer发送邮件的简单使用方法
2013/11/12 PHP
关于PHP中协程和阻塞的一些理解与思考
2017/08/11 PHP
php获取用户真实IP和防刷机制的实例代码
2018/11/28 PHP
tp5递归 无限级分类详解
2019/10/18 PHP
javascript的函数
2007/01/31 Javascript
javascript 出生日期和身份证判断大全
2008/11/13 Javascript
javascript类继承机制的原理分析
2009/09/12 Javascript
artdialog的图片/标题以及关闭按钮不显示的解决方法
2013/06/27 Javascript
JS操作JSON要领详细总结
2013/08/25 Javascript
浅析Javascript中“==”与“===”的区别
2014/12/23 Javascript
DOM基础教程之事件对象
2015/01/20 Javascript
Vue.js原理分析之observer模块详解
2017/02/17 Javascript
Angular2.js实现表单验证详解
2017/06/23 Javascript
js 获取元素的具体样式信息getcss(实例讲解)
2017/07/05 Javascript
详解Angular Reactive Form 表单验证
2017/07/06 Javascript
Vue事件处理原理及过程详解
2020/03/11 Javascript
vue之封装多个组件调用同一接口的案例
2020/08/11 Javascript
[01:38]DOTA2 2015国际邀请赛中国区预选赛 Showopen
2015/06/01 DOTA
python实现批量转换文件编码(批转换编码示例)
2014/01/23 Python
python比较两个列表大小的方法
2015/07/11 Python
Python实现SMTP发送邮件详细教程
2021/03/02 Python
SELENIUM自动化模拟键盘快捷键操作实现解析
2019/10/28 Python
Numpy将二维数组添加到空数组的实现
2019/12/05 Python
借助Paramiko通过Python实现linux远程登陆及sftp的操作
2020/03/16 Python
Python selenium自动化测试模型图解
2020/04/15 Python
selenium框架中driver.close()和driver.quit()关闭浏览器
2020/12/08 Python
采购主管工作职责
2013/12/12 职场文书
自我评价的写作规则
2014/01/06 职场文书
小学班级口号
2014/06/09 职场文书
“四风”问题的主要表现和危害思想汇报
2014/09/19 职场文书
2015年仓库管理员工作总结
2015/04/21 职场文书
2015年服务员个人工作总结
2015/05/27 职场文书
vue实现锚点定位功能
2021/06/29 Vue.js
vue 自定义的组件绑定点击事件
2022/04/21 Vue.js