基于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 相关文章推荐
js post方式传递提交的实现代码
May 31 Javascript
js编写trim()函数及正则表达式的运用
Oct 24 Javascript
js中Math之random,round,ceil,floor的用法总结
Dec 26 Javascript
javascript制作的网页侧边弹出框思路及实现代码
May 21 Javascript
node.js中的fs.fchmodSync方法使用说明
Dec 16 Javascript
jquery实现点击弹出带标题栏的弹出层(从右上角飞入)效果
Sep 19 Javascript
mvc 、bootstrap 结合分布式图简单实现分页
Oct 10 Javascript
smartupload实现文件上传时获取表单数据(推荐)
Dec 12 Javascript
微信小程序基于本地缓存实现点赞功能的方法
Dec 18 Javascript
vue中如何动态绑定图片,vue中通过data返回图片路径的方法
Feb 07 Javascript
关于RxJS Subject的学习笔记
Dec 05 Javascript
vue-cli中使用高德地图的方法示例
Mar 28 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
法压式咖啡之制作法
2021/03/03 冲泡冲煮
如何在HTML 中嵌入 PHP 代码
2015/05/13 PHP
Smarty foreach控制循环次数的一些方法
2015/07/01 PHP
PHP实现websocket通信的方法示例
2018/08/28 PHP
键盘控制事件应用教程大全
2006/11/24 Javascript
jQuery 验证插件 Web前端设计模式(asp.net)
2010/10/17 Javascript
JavaScript中的property和attribute介绍
2011/12/26 Javascript
PassWord输入框代码分享
2016/06/07 Javascript
深入解析JavaScript中的arguments对象
2016/06/12 Javascript
详解vue表单验证组件 v-verify-plugin
2017/04/19 Javascript
Nodejs调用WebService的示例代码
2017/09/29 NodeJs
JS装饰器函数用法总结
2018/04/21 Javascript
微信小程序实现滴滴导航tab切换效果
2018/07/24 Javascript
Vue axios设置访问基础路径方法
2018/09/19 Javascript
如何自定义微信小程序tabbar上边框的颜色
2019/07/09 Javascript
js实现手表表盘时钟与圆周运动
2020/09/18 Javascript
Python 40行代码实现人脸识别功能
2017/04/02 Python
Python更新数据库脚本两种方法及对比介绍
2017/07/27 Python
Python编程实现双链表,栈,队列及二叉树的方法示例
2017/11/01 Python
详解Python的hasattr() getattr() setattr() 函数使用方法
2018/07/09 Python
python 对txt中每行内容进行批量替换的方法
2018/07/11 Python
python使用matplotlib模块绘制多条折线图、散点图
2020/04/26 Python
python名片管理系统开发
2020/06/18 Python
Python虚拟环境的创建和使用详解
2020/09/07 Python
Python基于staticmethod装饰器标示静态方法
2020/10/17 Python
CSS3毛玻璃效果(blur)有白边问题的解决方法
2016/11/15 HTML / CSS
英国床垫和床架购物网站:Bedman
2019/11/04 全球购物
自动化专业毕业生自荐信
2013/11/01 职场文书
优秀家长事迹材料
2014/05/17 职场文书
班级体育活动总结
2014/07/05 职场文书
同志主要表现材料
2014/08/21 职场文书
2015年全民创业工作总结
2015/07/23 职场文书
php+laravel 扫码二维码签到功能
2021/05/15 PHP
详解Laravel制作API接口
2021/05/31 PHP
css3中2D转换之有趣的transform形变效果
2022/02/24 HTML / CSS
python 离散点图画法的实现
2022/04/01 Python