通过JS深度判断两个对象字段相同


Posted in Javascript onJune 14, 2019

代码:

/**
* 判断此对象是否是Object类型
* @param {Object} obj 
*/
function isObject(obj){
return Object.prototype.toString.call(obj)==='[object Object]';
};
/**
* 判断此类型是否是Array类型
* @param {Array} arr 
*/
function isArray(arr){
return Object.prototype.toString.call(arr)==='[object Array]';
};
/**
* 深度比较两个对象是否相同
* @param {Object} oldData 
* @param {Object} newData 
*/
function equalsObj(oldData,newData){
// 类型为基本类型时,如果相同,则返回true
if(oldData===newData)return true;
if(isObject(oldData)&&isObject(newData)&&Object.keys(oldData).length === Object.keys(newData).length){
// 类型为对象并且元素个数相同
// 遍历所有对象中所有属性,判断元素是否相同
for (const key in oldData) {
if (oldData.hasOwnProperty(key)) {
if(!equalsObj(oldData[key],newData[key]))
// 对象中具有不相同属性 返回false
return false;
}
}
}else if(isArray(oldData)&&isArray(oldData)&&oldData.length===newData.length){
// 类型为数组并且数组长度相同
for (let i = 0,length=oldData.length; i <length; i++) {
if(!equalsObj(oldData[i],newData[i]))
// 如果数组元素中具有不相同元素,返回false
return false;
}
}else{
// 其它类型,均返回false
return false;
}
// 走到这里,说明数组或者对象中所有元素都相同,返回true
return true;
};

测试:

var oldArr = [1,2,
[
{
name:"张三",
age:11,
}
],
{
name:'李四',
age:21,
em:[
{
address:'邯郸',
phone:'123'
},
{
address:'北京',
phone:234
}
]
}
];
var newArr = [1,2,
[
{
name:"张三",
age:11
}
],
{
name:'李四',
age:21,
em:[
{
address:'邯郸',
phone:'123'
},
{
address:'北京',
phone:234
}
]
}
];
console.log(equalsObj(oldArr,newArr));

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

Javascript 相关文章推荐
jQuery fadeTo方法调整图片的透明度使用介绍
May 06 Javascript
PHP+mysql+Highcharts生成饼状图
May 04 Javascript
js实现超酷的照片墙展示效果图附源码下载
Oct 08 Javascript
jQuery焦点图插件SaySlide
Dec 21 Javascript
谈谈对JavaScript原生拖放的深入理解
Sep 20 Javascript
vue-loader教程介绍
Jun 14 Javascript
详解Nuxt.js Vue服务端渲染摸索
Feb 08 Javascript
解决vue单页使用keep-alive页面返回不刷新的问题
Mar 13 Javascript
详解微信小程序-canvas绘制文字实现自动换行
Apr 26 Javascript
ES6 class的应用实例分析
Jun 27 Javascript
简单实现节流函数和防抖函数过程解析
Oct 08 Javascript
vue Element-ui表格实现树形结构表格
Jun 07 Vue.js
CKEditor 4.4.1 添加代码高亮显示插件功能教程【使用官方推荐Code Snippet插件】
Jun 14 #Javascript
利用JavaScript将Excel转换为JSON示例代码
Jun 14 #Javascript
CKeditor富文本编辑器使用技巧之添加自定义插件的方法
Jun 14 #Javascript
Vue动态创建注册component的实例代码
Jun 14 #Javascript
基于Proxy的小程序状态管理实现
Jun 14 #Javascript
深度了解vue.js中hooks的相关知识
Jun 14 #Javascript
Vue 实现前进刷新后退不刷新的效果
Jun 14 #Javascript
You might like
新手配置 PHP 调试环境(IIS+PHP+MYSQL)
2007/01/10 PHP
ThinkPHP多表联合查询的常用方法
2020/03/24 PHP
ThinkPHP中ajax使用实例教程
2014/08/22 PHP
ThinkPHP中pathinfo的访问模式、路径访问模式及URL重写总结
2014/08/23 PHP
php使用curl打开https网站的方法
2015/06/17 PHP
PHP中常见的缓存技术实例分析
2015/09/23 PHP
jquery 事件执行检测代码
2009/12/09 Javascript
iframe 父窗口和子窗口相互的调用方法集锦
2010/12/15 Javascript
jQuery动态地获取系统时间实现代码
2013/05/24 Javascript
JS去掉第一个字符和最后一个字符的实现代码
2014/02/20 Javascript
jQuery通过控制节点实现仅在前台通过get方法完成参数传递
2015/02/02 Javascript
认识less和webstrom的less配置方法
2017/08/02 Javascript
基于webpack4搭建的react项目框架的方法
2018/06/30 Javascript
vue实现点击隐藏与显示实例分享
2019/02/13 Javascript
Vue两个版本的区别和使用方法(更深层次了解)
2020/02/16 Javascript
JavaScript基于用户照片姓名生成海报
2020/05/29 Javascript
微信小程序12行js代码自己写个滑块功能(推荐)
2020/07/15 Javascript
html+vue.js 实现漂亮分页功能可兼容IE
2020/11/07 Javascript
使用python绘制人人网好友关系图示例
2014/04/01 Python
python从网络读取图片并直接进行处理的方法
2015/05/22 Python
在win和Linux系统中python命令行运行的不同
2016/07/03 Python
使用NumPy和pandas对CSV文件进行写操作的实例
2018/06/14 Python
对python中词典的values值的修改或新增KEY详解
2019/01/20 Python
关于Python 常用获取元素 Driver 总结
2019/11/24 Python
python爬虫模拟浏览器的两种方法实例分析
2019/12/09 Python
django实现更改数据库某个字段以及字段段内数据
2020/03/31 Python
Python读取Excel数据并生成图表过程解析
2020/06/18 Python
澳大利亚在线家具店:Luxo Living
2019/03/24 全球购物
SheIn沙特阿拉伯:女装在线
2020/03/23 全球购物
C语言面试题
2015/10/30 面试题
初一生物教学反思
2014/01/18 职场文书
机关作风整顿个人剖析材料
2014/10/06 职场文书
2014小学语文教学工作总结
2014/12/17 职场文书
工地食品安全责任书
2015/05/09 职场文书
检讨书格式
2019/04/25 职场文书
Python基础之hashlib模块详解
2021/05/06 Python