js如何判断对象数组中是否存在某个对象

 更新时间:2023年04月19日 09:45:59   作者:落笔映浮华H  
这篇文章主要介绍了js如何判断对象数组中是否存在某个对象问题,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教

js判断对象数组中是否存在某个对象

1. 判断数组中是否存在某个元素

直接用数组的indexOf方法就好,存在返回当前索引不存在返回-1

var arr=[1,2,3,4]
arr.indexOf(3) // 2
arr.indexOf(5) // -1

2. 遍历后判断对象的属性是否相同

arr.forEach(item=>{
    if(item.name==='Alex'){
        alert('存在这个元素');
    }
})

3. 动态添加或删除对象或元素的

用这个方法的话不好操作,可能会添加或删除掉多个,可以是用string的indexOf方法来判断

const option = {name:'111'}
// 如果数组里面本身不存在这个对象则把这个加进去
if(JSON.stringify(arr).indexOf(JSON.stringify(option))===-1){
           arr.push(option); // 进行动态的操作
}

这个判断是可以,但存在一个问题需要注意一下,如果对象的顺序不一样,是不能检测到重复的

例如arr = [{name:'张三', sex:'男'}]

option = {sex:'男', name:'张三'}

利用上述方法检测的话,实际上该数组是存在这个数组对象的,但如果用string的indexOf方法是不能检测对的,用这个方法的时候这个点需要注意

4. 设一个flag来做判断的标识

let flag = true;
let msg = '';
let arr = []
 
if(arr.length<6){
    arr.forEach(item=>{
        if(data.id===item.id){ // 对象里的唯一标识id
            msg = '请勿重复添加!'
            flag = false;
        }
    })
}else{
    msg = '最多添加6个!'
    flag = false;
}
 
if(flag){ // 如果满足条件-数组长度小于6,当前添加的值在数组里不存在,就把值添加进去
    arr.push(data)
}else{ // 否则弹出提示信息
    alert(msg)
}

5. 利用数组API some来判断

var result = arr.some(item=>{
   if(item.name==='张三'){
      return true 
  } 
})
// if 可以省略
var result = arr.some(item=>item.name==='张三')
console.log(result) // 如果arr数组对象中含有name:'张三',就会返回true,否则返回false
if(result){ // 如果存在
  // do something
 }

js对象数组根据某一属性查找对象

js对象数组[{name: "zhangsan", age: 20}, {name: "lisi", age: 30}], 如果想查找name是zhangsan的这个对象,传统方法可以根据for+if条件遍历,也可以用map重新构造,或者组装新对象。

1. 组装新对象

 list.forEach(function (item) {

   selectObj[item.name] = item

 })

selectObj新对象结构为:{"zhangsan": {name: "zhangsan", age: 20}, "lisi": {name: "lisi", age: 30}}, 通过selectObj[zhangsan]即可获取。

2. 或者使用es6中的新特性

list.find(item => item.name == "zhangsan")

其他的比如filter, some, every方法也都很好用。

总结

以上为个人经验,希望能给大家一个参考,也希望大家多多支持脚本之家。

相关文章

  • 全系IE支持Bootstrap的解决方法

    全系IE支持Bootstrap的解决方法

    用了bootstrap模版搭建的网站,在IE7中打不开,在IE8中背景图片都不显示,内容排列也出现问题,在IE9中表现的最好,在IE11中出现弹出层中的图片无法显示,那么这些兼容性怎么去解决
    2015-10-10
  • 关于JavaScript中事件绑定的方法总结

    关于JavaScript中事件绑定的方法总结

    下面小编就为大家带来一篇JavaScript中事件绑定的方法总结。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-10-10
  • JavaScript偏函数与柯里化实例详解

    JavaScript偏函数与柯里化实例详解

    这篇文章主要介绍了JavaScript偏函数与柯里化,结合实例形式详细分析了JavaScript偏函数与柯里化的概念、原理、定义、使用方法及相关操作注意事项,需要的朋友可以参考下
    2019-03-03
  • javascript判断ie浏览器6/7版本加载不同样式表的实现代码

    javascript判断ie浏览器6/7版本加载不同样式表的实现代码

    ie6/ie7的兼容问题很让人苦恼,我们可以针对这两个版本的浏览器单独写独立的样式表,来解决兼容问题。这里的例子以判断ie6与ie7来加载不同的样式表
    2011-12-12
  • bootstrap——bootstrapTable实现隐藏列的示例

    bootstrap——bootstrapTable实现隐藏列的示例

    本篇文章主要介绍了bootstrapTable实现隐藏列的示例,具有一定的参考价值,有兴趣的可以了解一下。
    2017-01-01
  • javascript显示用户停留时间的简单实例

    javascript显示用户停留时间的简单实例

    这篇文章介绍了javascript显示用户停留时间的简单实例,有需要的朋友可以参考一下
    2013-08-08
  • JavaScript实现大文件上传的示例代码

    JavaScript实现大文件上传的示例代码

    这篇文章主要为大家详细介绍了JavaScript实现大文件上传功能的示例代码,文中的代码讲解详细,对我们学习JavaScript有一定帮助,感兴趣可以跟随小编一起学习一下
    2022-11-11
  • JS使用Promise时常见的5个错误总结

    JS使用Promise时常见的5个错误总结

    Promise 提供了一种优雅的方法来处理 JS 中的异步操作。这也是避免“回调地狱”的解决方案。然而,并没有多少开发人员了解其中的内容。因此,许多人在实践中往往会犯错误。在本文中,介绍一下使用 promise 时的五个常见错误,希望大家能够避免
    2022-11-11
  • 点击标签切换和自动切换DIV选项卡

    点击标签切换和自动切换DIV选项卡

    点击标签切换DIV的效果,在很多地方都有见到过,而且实现的方法有很多,本例介绍的这个可以切换和自动切换DIV选项卡
    2014-08-08
  • Bootstrap表单Form全面解析

    Bootstrap表单Form全面解析

    在进行自己的后台改版时,大体布局都使用了bootstrap,剩下的表单部分没理由不去使用它,对于表单的美化和布局,bootstrap做的也是很不错的。下文给大家介绍Bootstrap表单Form全面解析,感兴趣的朋友一起看下吧
    2016-06-06

最新评论