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 相关文章推荐
JavaScript获取网页表单提交方式的方法
Apr 02 Javascript
jQuery右侧选项卡焦点图片轮播特效代码分享
Sep 05 Javascript
jQuery事件绑定on()与弹窗实现代码
Apr 28 Javascript
实例讲解JavaScript的Backbone.js框架中的View视图
May 05 Javascript
bootstrap中模态框、模态框的属性实例详解
Feb 17 Javascript
20行JS代码实现网页刮刮乐效果
Jun 23 Javascript
详解webpack babel的配置
Jan 09 Javascript
详解如何解决Vue和vue-template-compiler版本之间的问题
Sep 17 Javascript
Node.js net模块功能及事件监听用法分析
Jan 05 Javascript
我要点爆”微信小程序云开发之项目建立与我的页面功能实现
May 26 Javascript
Vue中this.$nextTick的作用及用法
Feb 04 Javascript
js实现有趣的倒计时效果
Jan 19 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
玛琪朵 Macchiato
2021/03/03 咖啡文化
PHP实现把MySQL数据库导出为.sql文件实例(仿PHPMyadmin导出功能)
2014/05/10 PHP
PHP中strlen()和mb_strlen()的区别浅析
2014/06/19 PHP
微信企业转账之入口类分装php代码
2018/10/01 PHP
css+js实现部分区域高亮可编辑遮罩层
2014/03/04 Javascript
jQuery实现的AJAX简单弹出层效果代码
2015/11/26 Javascript
jQuery获取与设置iframe高度的方法
2016/08/01 Javascript
jQuery自适应轮播图插件Swiper用法示例
2016/08/24 Javascript
微信小程序 九宫格实例代码
2017/01/21 Javascript
深入理解js中的加载事件
2017/02/08 Javascript
Angular2 父子组件数据通信实例
2017/06/22 Javascript
webpack踩坑之路图片的路径与打包
2017/09/05 Javascript
nodejs 简单实现动态html的方法
2018/05/12 NodeJs
vue forEach循环数组拿到自己想要的数据方法
2018/09/21 Javascript
JavaScript实现京东放大镜效果
2019/12/03 Javascript
[02:55]2018DOTA2国际邀请赛勇士令状不朽珍藏Ⅲ饰品一览
2018/08/01 DOTA
python中os操作文件及文件路径实例汇总
2015/01/15 Python
scrapy爬虫实例分享
2017/12/28 Python
python实现textrank关键词提取
2018/06/22 Python
Python2和3字符编码的区别知识点整理
2019/08/08 Python
自定义django admin model表单提交的例子
2019/08/23 Python
pycharm新建Vue项目的方法步骤(图文)
2020/03/04 Python
keras实现多种分类网络的方式
2020/06/11 Python
解决Keras自带数据集与预训练model下载太慢问题
2020/06/12 Python
Django框架请求生命周期实现原理
2020/11/13 Python
animation和transition的区别
2020/10/12 HTML / CSS
美国乡村商店:Plow & Hearth
2016/09/12 全球购物
英国女士和男士时尚服装网上购物:Top Labels Online
2018/03/25 全球购物
个人教师自我评价范文
2013/12/02 职场文书
军人违纪检讨书
2014/02/04 职场文书
本科生导师推荐信范文
2014/05/18 职场文书
诚信贷款承诺书
2014/05/30 职场文书
教室布置标语
2014/06/26 职场文书
优秀党员申报材料
2014/12/18 职场文书
大学学生会辞职信
2015/05/13 职场文书
MySQL入门命令之函数-单行函数-流程控制函数
2021/04/05 MySQL