js判断一个对象是否在一个对象数组中(场景分析)

 更新时间:2022年08月04日 08:41:55   作者:接着奏乐接着舞  
这篇文章主要介绍了js判断一个对象是否在一个对象数组中,本文通过场景分析给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧

场景:

有一个对象数组,如:

var arr = [{"appName":"小何","appId":"1"},{"appName":"小王","appId":"2"}]

一般来说,常见的场景有两个:

第一个是,比如鼠标点击按钮,往数组里push()一个对象,如果数组中已经存在了,那么就得提示不能添加。

第二个是,push()之后做去重处理,既对象数组去重。

第一个场景解法:如果数组中已经存在,就不能添加

使用includes()方法,意为存在,存在返回true,不存在返回false,重点是要结合JSON.stringify()序列化为字符串后再判断,以下是示例代码:

var arr = [{"appName":"小何","appId":"1"},{"appName":"小王","appId":"2"}]
 
var obj = {"appName":"小王","appId":"2"}
 
//如果数组arr中不存在字符串JSON.stringify(obj),那就可以添加,反之,则不添加
if(JSON.stringify(arr).includes(JSON.stringify(obj)) === false){
     console.log('不存在')
     arr.push(obj)
}else{
     console.log('已存在')
}

小结:

es6新增的includes()方法很强大,字符串,数组,对象均可使用,返回一个布尔值,比之前常用的indexof()语义化更强,且includes()的性能不错!

第二个场景解法: 对象数组去重

我理解的对象数组去重是这样的:

就是他们的属性和值都得一样,且他们的长度也是一样的。

也就是说,key和value都得一样才行,而且不能多不能少。

试着手写了一下,嵌套了好几层循环,性能不好,直接一步到位,以下是我的最优解:

lodash是前端常用的JS方法库,就是将很多方法封装起来,方便使用。

使用lodash的_.uniqWith()方法,结合_.isEqual比较函数,即可较为完美的解决问题。

需要注意的是,_.isEqual()方法也是非常强大的,作用是比较两个对象是否相等,这个方法非常实用,我经常用它,他是深层递归的,推荐。

代码示例:

var objects = [{ 'x': 1, 'y': 2 }, { 'x': 2, 'y': 1 }, { 'x': 1, 'y': 2 }];
_.uniqWith(objects, _.isEqual);
// => [{ 'x': 1, 'y': 2 }, { 'x': 2, 'y': 1 }]

到此这篇关于js判断一个对象是否在一个对象数组中的文章就介绍到这了,更多相关js判断一个对象在一个对象数组中内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • js编写的treeview使用方法

    js编写的treeview使用方法

    这篇文章主要为大家详细介绍了js编写的treeview使用方法,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2016-11-11
  • js实现支付倒计时返回首页

    js实现支付倒计时返回首页

    这篇文章主要为大家详细介绍了js实现支付倒计时返回首页,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2021-10-10
  • 异步动态加载JS并运行(示例代码)

    异步动态加载JS并运行(示例代码)

    这篇文章主要是对异步动态加载JS并运行的示例代码进行了介绍。需要的朋友可以过来参考下,希望对大家有所帮助
    2013-12-12
  • 微信小程序实现获取自己所处位置的经纬度坐标功能示例

    微信小程序实现获取自己所处位置的经纬度坐标功能示例

    这篇文章主要介绍了微信小程序实现获取自己所处位置的经纬度坐标功能,涉及微信小程序地图功能获取经纬度信息的相关操作技巧,需要的朋友可以参考下
    2017-11-11
  • 用vbs实现的连连看在线游戏

    用vbs实现的连连看在线游戏

    大家可以参考下代码,发现这个真个不错的思路
    2008-07-07
  • 微信小程序Vant组件库的安装与使用教程

    微信小程序Vant组件库的安装与使用教程

    之前推荐过的移动端web组件库 Vant是Vue.js版本的,其对内承载了有赞所有核心业务,对外有十多万开发者在使用,一直是业界主流的移动端组件库之一,下面这篇文章主要给大家介绍了关于微信小程序Vant组件库的安装与使用的相关资料,需要的朋友可以参考下
    2022-09-09
  • JS实现程序暂停与继续功能代码解读

    JS实现程序暂停与继续功能代码解读

    程序暂停与继续的实现方法有很多,在本文为大家介绍下js中是如果做到的,并对具体的功能代码进行注释说明,感兴趣的朋友不要错过
    2013-10-10
  • nodejs读取memcache示例分享

    nodejs读取memcache示例分享

    本人主要介绍了使用nodejs如何读取memcache的示例程序,大家参考使用吧
    2014-01-01
  • 用Golang运行JavaScript的实现示例

    用Golang运行JavaScript的实现示例

    这篇文章主要介绍了用Golang运行JavaScript的实现示例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-11-11
  • js位运算在实际中使用的实例教程

    js位运算在实际中使用的实例教程

    我们可能很少在编程中用位运算,如果没深入学习,可能也很难理解,下面这篇文章主要给大家介绍了关于js位运算在实际中使用的相关资料,需要的朋友可以参考下
    2022-03-03

最新评论