Javascript根据id获取数组对象
在业务中,列表页跳转详情页时,经常会将Id值传入,然后再根据id值异步获取数据。
假设有服务端的json数据: <注意,这里的data是指已经从后端获取的json, 而非后端原始的文件>
let data = [
{id: 1, title: 'React'},
{id: 2, title: 'Vue'},
{id: 3, title: 'Angular'},
{id: 4, title: 'Django'},
{id: 5, title: 'Laravel'}
]
在前端,根据id,获取详情
getDetail(_id) {
let result = data.find((item) => {
return item.id == _id
})
console.log(result)
} /*
_id是列表页传进来的id值, 注意:使用==, 如使用===必须左右值的类型相同
对比item.id 是否等于_id, 如相等,则返回。
*/
延伸:数组过滤方法还有filter,for循环,forEach
filter遍历整个数组,可以返回多个结果.
而find找到的第一个立即返回,不会继续往下遍历。
Javascript根据id获取数组对象的更多相关文章
- JavaScript 获取数组对象中某一值封装为数组
1.获取数组对象中某一值封装为数组(一) data = [["2000-06-05",116],["2000-06-06",129]]; var dateLis ...
- JavaScript通过ID获取元素坐标
JavaScript通过ID获取元素坐标 function getElementPos(elementId) { var ua = navigator.userAgent.toLowerCase ...
- JavaScript中的类数组对象
在javascript中,对象与数组都是这门语言的原生规范中的基本数据类型,处于并列的位置. 一般来说,如果我们有一个对象obj和一个数组a: obj["attr1"]; / ...
- javascript事件:获取事件对象getEvent函数
在javascript开发中我们会经常获取页面中的事件对象,然后来处理这些事件,例如下面的getEvent函数就是获取javascript下的页面事件对象. function getEvent(eve ...
- java基础64 JavaScript中的Arrays数组对象和prototype原型属性(网页知识)
1.Arrays数组对象的创建方式 方式一: var 变量名=new Array(); //创建一个长度为0的数组. 方式二: var 变量名=new Array(长度); //创建一个指定长度的数组 ...
- JavaScript通过id获取不到元素是什么原因阿?
s代码 JavaScript code ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 function show_more_mess() { $(&qu ...
- Jquery判断$("#id")获取的对象是否存在的方法
如果是下面的 jquery 代码判断一个对象是否存在,是不能用的 if($("#id")){ }else{} 因为 $(“#id”) 不管对象是否存在都会返回 object . 正 ...
- Jquery判断$("#id")获取的对象是否存在
一.判断对象对象是否存在 如果是下面的 jQuery 代码判断一个对象是否存在,是不能用的 代码如下: if($("#id")){ }else{} 因为 $(“#id”) 不管 ...
- JavaScript把两个数组对象合并成一个一一对应的数组对象
合并数组或者对象在数组或对象前面加...,是es6的新写法,然后数组的map方法会返回数组. var obj1 = [{ , "model": "XQG70-S1208F ...
随机推荐
- Qt学习记录--02 Qt的信号槽机制介绍(含Qt5与Qt4的差异对比)
一 闲谈: 熟悉Window下编程的小伙伴们,对其消息机制并不陌生, 话说:一切皆消息.它可以很方便实现不同窗体之间的通信,然而MFC库将很多底层的消息都屏蔽了,尽管使用户更加方便.简易地处理消息,但 ...
- win2003远程桌面怎么切换到多用户?
怎么用远程桌面切换server2003的多用户的问题?server2003操作系统的远程桌面是多用户的,就是你的机子远程桌面到服务器而其它机子也可以远程桌面,所以往往有时候你看不到原始的桌面的样子,所 ...
- Maven-设置默认Java编译版本
有两种方式,一种针对项目,一种针对全局 针对项目,需要在pom.xml中添加如下配置: <build> <plugins> <plugin> <groupId ...
- there was an error running the selected code generator unable to retrieve metadata for
there was an error running the selected code generator unable to retrieve metadata for PROBLEM: I ha ...
- js和css实现手机横竖屏预览思路整理
实现效果,如上图. 首先,实现手机页面在PC端预览, 则先在网上找到一个手机的背景图片,算好大概内间距,用来放预览的页面,我这里是给手机预览页面的尺寸按iphone5的尺寸来的: 一个手机页面在这里预 ...
- nginx set变量后lua无法改值
今天在使用lua修改nginx自定义变量的时候,发现死活更改不了,如下所示: 有问题的代码 set $check "1"; rewrite_by_lua_file 'conf/ru ...
- google的Python风格规范
Python风格规范 分号 Tip 不要在行尾加分号, 也不要用分号将两条命令放在同一行. 行长度 Tip 每行不超过80个字符 例外: 长的导入模块语句 注释里的URL 不要使用反斜杠连接行. ...
- Oracle密码过期问题 ORA-28001:the password has expired
如果已经过期了,首先需要修改密码,然后设置密码为无限期.修改以sys用户登陆. 修改密码:alter user username identified by password 密码可以和之前的密码相 ...
- C# word 图片大小
通过Office自带的类库word文档中插入图片,图片大小的单位为磅 而文档中,图片的大小已经固定,为CM. 实际工作中,首先将图片插入到word中,根据目前的大小,计算转换为目标大小的比率,将长宽按 ...
- Java程序员必会英语单词
Complie: 编译 line: 行 variable: 变量 parameter: 参数 defaul: 默认 access: 访问 operation: 操作运算 member-variabl ...