JS中如何比较两个Json对象是否相等实例代码


Posted in Javascript onJuly 13, 2016

在js前端面试过程中,经常会遇到这样的笔试题:JS中如何比较两个Json对象是否相等实例代码,下面小编抽点时间给大家整理下,一起看看吧。

1.先准备三个工具方法,用于判断是否是对象类型,是否是数组,获取对象长度

function isObj(object) {
return object && typeof (object) == 'object' && Object.prototype.toString.call(object).toLowerCase() == "[object object]";
}
function isArray(object) {
return object && typeof (object) == 'object' && object.constructor == Array;
}
function getLength(object) {
var count = 0;
for (var i in object) count++;
return count;
}

2.准备两个相同或不同的Json对象

var jsonObjA = {
"Name": "MyName",
"Company": "MyCompany",
"Infos": [
{ "Age": "100" },
{
"Box": [
{ "Height": "100" },
{ "Weight": "200" }
]
}
],
"Address": "马栏山"
}
var jsonObjB = {
"Name": "MyName",
"Company": "MyCompany",
"Infos": [
{ "Age": "100" },
{
"Box": [
{ "Height": "100" },
{ "Weight": "200" }
]
}
],
"Address": "马栏山二号"
}

3.主要的代码

function Compare(objA, objB) {
if (!isObj(objA) || !isObj(objB)) return false; //判断类型是否正确
if (getLength(objA) != getLength(objB)) return false; //判断长度是否一致
return CompareObj(objA, objB, true);//默认为true
}
function CompareObj(objA, objB, flag) {
for (var key in objA) {
if (!flag) //跳出整个循环
break;
if (!objB.hasOwnProperty(key)) { flag = false; break; }
if (!isArray(objA[key])) { //子级不是数组时,比较属性值
if (objB[key] != objA[key]) { flag = false; break; }
} else {
if (!isArray(objB[key])) { flag = false; break; }
var oA = objA[key], oB = objB[key];
if (oA.length != oB.length) { flag = false; break; }
for (var k in oA) {
if (!flag) //这里跳出循环是为了不让递归继续
break;
flag = CompareObj(oA[k], oB[k], flag);
}
}
}
return flag;
}

4.调用方法

var result = Compare(jsonObjA, jsonObjB);
console.log(result); // true or false
Javascript 相关文章推荐
JQUERY 设置SELECT选中项代码
Feb 07 Javascript
jQuery获取(选中)单选,复选框,下拉框中的值
Feb 21 Javascript
Javascript技术栈中的四种依赖注入小结
Feb 27 Javascript
JavaScript页面实时显示当前时间实例代码
Oct 23 Javascript
原生js实现简单的链式操作
Jul 04 Javascript
webpack使用 babel-loader 转换 ES6代码示例
Aug 21 Javascript
AngularJS集合数据遍历显示的实例
Dec 27 Javascript
vue.js的computed,filter,get,set的用法及区别详解
Mar 08 Javascript
Vue 与 Vuex 的第一次接触遇到的坑
Aug 16 Javascript
jQuery 同时获取多个标签的指定内容并储存为数组
Nov 20 jQuery
javascript中floor使用方法总结
Feb 02 Javascript
html中创建并调用vue组件的几种方法汇总
Nov 17 Javascript
js实现可键盘控制的简单抽奖程序
Jul 13 #Javascript
原生js仿jquery animate动画效果
Jul 13 #Javascript
瀑布流的实现方式(原生js+jquery+css3)
Jun 28 #Javascript
jquery计算出left和top,让一个div水平垂直居中的简单实例
Jul 13 #Javascript
Javascript类型系统之undefined和null浅析
Jul 13 #Javascript
JS基础随笔(菜鸟必看篇)
Jul 13 #Javascript
Bootstrap的Refresh Icon也spin起来
Jul 13 #Javascript
You might like
基于pear auth实现登录验证
2010/02/26 PHP
php实现统计邮件大小的方法
2013/08/06 PHP
php关联数组快速排序的方法
2015/04/17 PHP
PHP实现图片上传并压缩
2015/12/22 PHP
PHP简单实现二维数组的矩阵转置操作示例
2017/11/24 PHP
jQuery Study Notes学习笔记 (二)
2010/08/04 Javascript
javascript提取URL的搜索字符串中的参数(自定义函数实现)
2013/01/22 Javascript
jquery 利用show和hidden实现级联菜单示例代码
2013/08/09 Javascript
Node.js返回JSONP详解
2016/05/18 Javascript
jQuery ajax应用总结
2016/06/02 Javascript
Node.JS中事件轮询(Event Loop)的解析
2017/02/25 Javascript
JavaScript两个变量交换值的实现方法
2017/03/01 Javascript
Cpage.js给组件绑定事件的实现代码
2017/08/31 Javascript
Python实现二叉树结构与进行二叉树遍历的方法详解
2016/05/24 Python
使用Python多线程爬虫爬取电影天堂资源
2016/09/23 Python
Python实现定时备份mysql数据库并把备份数据库邮件发送
2018/03/08 Python
python 实现将txt文件多行合并为一行并将中间的空格去掉方法
2018/12/20 Python
深入解析python中的实例方法、类方法和静态方法
2019/03/11 Python
python实现维吉尼亚算法
2019/03/20 Python
Python之time模块的时间戳,时间字符串格式化与转换方法(13位时间戳)
2019/08/12 Python
利用python计算时间差(返回天数)
2019/09/07 Python
基于Python中的yield表达式介绍
2019/11/19 Python
如何使用python实现模拟鼠标点击
2020/01/06 Python
使用Python防止SQL注入攻击的实现示例
2020/05/21 Python
python线性插值解析
2020/07/05 Python
Django model class Meta原理解析
2020/11/14 Python
使用canvas压缩图片上传的方法示例
2020/02/07 HTML / CSS
365 Tickets英国:全球景点门票
2019/07/06 全球购物
欧缇丽加拿大官方网站:Caudalie加拿大
2019/07/18 全球购物
《穷人》教学反思
2014/04/08 职场文书
市级绿色学校申报材料
2014/08/25 职场文书
2014年人民调解工作总结
2014/12/08 职场文书
裁员通知
2015/04/25 职场文书
法人身份证明书
2015/06/18 职场文书
redis 解决库存并发问题实现数量控制
2022/04/08 Redis
Oracle中日期的使用方法实例
2022/07/07 Oracle