IT数码 购物 网址 头条 软件 日历 阅读 图书馆
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
图片批量下载器
↓批量下载图片,美女图库↓
图片自动播放器
↓图片自动播放器↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁
 
   -> JavaScript知识库 -> JavaScript在数组中寻找相同对象元素的问题 -> 正文阅读

[JavaScript知识库]JavaScript在数组中寻找相同对象元素的问题

这两天在写项目的时候,我用数组存储对象元素,但是用indexOf方法寻找数组中对象的下标时出现了问题。indexOf方法一直返回-1,即没有找到对象。但我很确定数组中有该对象元素,那究竟是怎么回事呢?

我看了一下indexOf的定义和用法:

indexOf() 方法可返回数组中某个指定的元素位置。

该方法将从头到尾地检索数组,看它是否含有对应的元素。开始检索的位置在数组 start 处或数组的开头(没有指定 start 参数时)。如果找到一个 item,则返回 item 的第一次出现的位置。开始位置的索引为 0。

如果在数组中没找到指定元素则返回 -1。

诶!?好像没问题?

但是代码是不会骗人的!于是我就单独写了一个test进行测试。

代码如下:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>test</title>
</head>
<body>
<button type="button" onclick="test()">test</button>
</body>
<script>
function test(){
	let ob1 = {OP:"w",type:"t1"};
	let ob2 =  {OP:"w",type:"t1"};
	let view = [];
	view.push(ob1);
	console.log(view.indexOf(ob1));
	console.log(view.indexOf({OP: 'w', type: 't1'}));
	console.log(view.indexOf(ob2));
	console.log(view);
	console.log(typeof view[0]);
	console.log(typeof ob1);
	console.log(typeof {OP:"w",type:"t1"});
	console.log({OP:"w",type:"t1"} === ob1);
	console.log(ob2 === ob1);
}
</script>
</html>

结果如下:

?

?可以看到,ob1,ob2虽然在对象的定义上完全一样,但是它们不等价,即不相等。那就可以明白为什么indexOf方法无法找到对象元素的问题了。到这里我才知道原来对象不能直接比较,而是要比对所有的键值(唉,当初学的时候也没有注意这个问题QAQ)。

结论:indexOf方法不能用于寻找对象元素,因为对象元素不能直接比较。如果想要知道对象元素在数组中的下标,就单独设一个函数,循环比较对象与数组元素的所有键值。

  JavaScript知识库 最新文章
ES6的相关知识点
react 函数式组件 & react其他一些总结
Vue基础超详细
前端JS也可以连点成线(Vue中运用 AntVG6)
Vue事件处理的基本使用
Vue后台项目的记录 (一)
前后端分离vue跨域,devServer配置proxy代理
TypeScript
初识vuex
vue项目安装包指令收集
上一篇文章      下一篇文章      查看所有文章
加:2022-05-08 07:59:01  更:2022-05-08 08:00:40 
 
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁

360图书馆 购物 三丰科技 阅读网 日历 万年历 2024年11日历 -2024/11/23 22:32:55-

图片自动播放器
↓图片自动播放器↓
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
图片批量下载器
↓批量下载图片,美女图库↓
  网站联系: qq:121756557 email:121756557@qq.com  IT数码