ES6语法find查找匹配数组

最新推荐文章于 2024-03-21 14:46:10 发布
最新推荐文章于 2024-03-21 14:46:10 发布
阅读量225 收藏
点赞数
文章标签： 前端 数据库 ViewUI
原文链接：http://www.cnblogs.com/beimingbingpo/p/9485321.html
版权 
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>find查找数组数据</title>
</head>
<body>
<script>
let myId = 3;
    
let data = [
    {id:1,value:false},
    {id:2,value:false},
    {id:3,value:false}
];
    
var findVal = data.find(item => {
    return item.id === myId;
});
 
findVal.value = true; //修改匹配项的值
 
console.log(findVal); // 打印匹配项数据
</script>
</body>
</html>


遇到个功能是要分类就想说在前端过滤，不要从查数据库的时候过滤了。然后就想说除了filter还有啥好用的

发现有个find，测试一番之后发现

const list = [{'name':'1',index:1},{'name':'2'},{'name':'1'}]
let list2 = list.find(i=>i.name==='1') 

let list3 = list.filter(i=>i.name==='1')

console.log(list); [ { name: '1', index: 1 }, { name: '2' }, { name: '1' } ]
console.log(list2); { name: '1', index: 1 }

console.log(list3);[ { name: '1', index: 1 }, { name: '1' } ]

find 和 filter 都是不改变原数组的方法

但是find只查出第一个符合条件的结果像例子里是直接返回了一个对象而不是数组！

，而filter返回全部结果仍然是数组。

 

 

转载于:https://www.cnblogs.com/beimingbingpo/p/9485321.html

weixin_30608503
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
js代码-输出数组中重复的元素
07-16
此外，还有一种更简洁的ES6语法解决方案，使用`reduce`和`filter`方法： ```javascript function findDuplicatesWithReduce(arr) { return arr.reduce((acc, val) => acc.includes(val) ? acc.concat(val) : acc, ...
JS实现数组的find方法
ZegTsai's blogs
08-20 8179
JS实现数组的常用方法 编程思路：先确定方法要传入的参数和返回的值，再通过原型定义，在Array的原型上添加自定的方法，验证是否达到预期效果。 1、find的功能 array.find(function(currentValue, index, arr), thisValue) 功能：返回通过测试（函数内判断）的数组的第一个元素的值。简单理解就是：传入判断条件，判断数组各个元素，返回满足条件...
原生js对数组操作（find，findIndex）
技术分享
09-28 2078
find（返回符合传入测试（函数）条件的数组元素。） let list =[ {id: 4, pid: 3, menuName: "操作日志", menuLevel: 2, url: "/operatelogs"}, {id: 8, pid: 7, menuName: "富文本", menuLevel: 2, url: "/richtext"}, {id: 11, pi...
最有用的 Javascript 数组方法整理汇总
web前端开发
04-09 188
来源 |https://blog.devgenius.io/most-useful-javascript-array-methods-9685e61760b1翻译 |杨小爱数组提供了很多方法，为了让开发变得简单高效，在今天的文章中，我们整理汇总了一些有用的JavaScript数组方法。1、Array.map()map() 方法返回一个新数组，数组中的元素为原始数组元素...
js 查找对象数组中的指定元素（find方法排坑）
fakeend的博客
01-05 902
—通过这个大佬的文章终于解决了问题。（以下是个人理解，经供参考）find方法会依次检验item是否与判定值相等，如果不相等，它也会返回一个undefined,同时res接收到了这个undefined，在被渲染就会报错。现在要从学生表（studentList）中获取到id为2的对象的name，这边不使用循环，直接推荐使用find方法。
JS——find过滤数组
qq_43201350的博客
06-06 822
<template> <div> <button @click="myClick">过滤数组</button> </div> </template> <script> export default { data () { return { allName: 'nick', list: [ { id: 0, name:
Find-Me:一个简单的单词搜索游戏，可帮助您学习词汇和拼写
04-11
9. **模块化编程**：为了保持代码的整洁和可维护性，JavaScript 代码可能被组织成模块，使用立即执行函数表达式（IIFE）或 ES6 的模块语法（如 `import` 和 `export`）。 通过分析 "Find-Me" 的源代码（在 Find-Me-...
0.前言1
08-03
数组增加了`Array.from()`用于从类数组对象创建数组，`Array.of()`用于创建指定元素的数组，以及`find()`和`findIndex()`等查找方法。对象则引入了属性初始化器、属性简写、计算属性名以及`Object.assign()`用于合并...
js代码-FindFirstNodeJS
07-15
- 如果是在数组中查找，可以使用`Array.prototype.findIndex()`或`Array.prototype.find()`方法。 - 如果是在自定义的数据结构（如链表或树）中查找，可能需要编写自定义的遍历函数。这通常涉及对每个节点进行检查...
JavaScript 中文帮助.rar
01-18
ES6引入了新的数组特性，如扩展运算符、fill、find、findIndex等。 6. **事件和DOM操作**：JavaScript可以通过事件监听和处理来响应用户的交互，如click、mouseover等。DOM（Document Object Model）是HTML和XML...
ES6 find 和 filter 的区别
热门推荐
李嘉杰的博客
02-03 3万+
遇到个功能是要分类就想说在前端过滤，不要从查数据库的时候过滤了。然后就想说除了filter还有啥好用的 发现有个find，测试一番之后发现 const list = [{'name':'1',index:1},{'name':'2'},{'name':'1'}] let list2 = list.find(i=>i.name==='1')  let list3 = list.filter(
js数组中的方法 some, every, filter, find,map, reduce讲解及使用场景
weixin_44022064的博客
09-26 987
前言 之前对数组的循环来说，我拿到代码就使用forEach循环，主要原因是我对数组的其他方法不是很了解，以及觉得forEach已经可以做到想要的效果，没必要在去使用其他方法，这都是对使用场景不了解导致的，为了让自己的代码不再是千篇一律的forEach。特地总结一下这几个方法。 函数1：some 函数形式：arr.some((value, index, arr) => {})...
JavaScript的常用函数之find()、filter()、map()
llly0987的博客
07-25 2438
map、find、filter函数详解。filter和find()区别，
js进阶-Es6的新特性
m0_65769258的博客
04-16 540
(一) let 命令和const命令# 知识点:# let的用法类似于var，用于变量的声明 使用let就会产生块级作用域,let命令只在块级作用域内(也就是大括号内)有效 let在同一作用域内只能声明一次, 不能重复声明 let和const不存在变量提升 详细例子:# 1. let命令# <script> //1.let块级作用域 { var a = 100; let b = 200; }
JS高级：数组方法map、filter、find等的用法与实现
weixin_46831501的博客
03-27 1461
数组的高阶函数使用以及实现
JS树结构操作:查找、遍历、筛选、树结构和列表结构相互转换
web前端开发
11-24 1421
来源 |https://wintc.top/article/20经常有同学问树结构的相关操作，也写了很多次，在这里总结一下JS树形结构一些操作的实现思路，并给出了简洁易懂的代码实现。本...
JS中 filter、find和map用于筛选、查找
最新发布
lakewind6的博客
03-21 604
filter和map都会对数组中每一个元素进行遍历，find在找到第一个元素时即停止。2、用于过滤时会对每一个元素进行处理，得到的结果不会改变数组的长度。满足指令条件的元素，并返回数组，若不存在即返回undefined。满足该条件的元素，返回该元素，1、map主要用于映射。
[ES6] 理解JavaScript中 map、forEach、filter 和 find 与箭头函数的使用
zhtbs的博客
03-24 1743
如果你是一个刚开始学习 JavaScript 的人，你可能会觉得编写箭头函数很容易。但如果在箭头函数出现之前你已经习惯了 JavaScript 的写法，那么在你适应之前，每次遇到箭头函数时，你可能需要上网搜索箭头函数的语法或整理笔记。我相信很多人都有这样的经历。然而，一旦你适应了箭头函数的写法，你就可以写出更简洁的代码，以至于在以后你可能会忘记传统的写法。在本文中，我们将讲解如何使用箭头函数和 map、forEach、find、filter 函数，帮助你掌握箭头函数的编写方法和各个函数的使用方法。
前端：JS的数组的遍历、map、filter、find、some、every的用法示例
风行天下
06-28 2457
在JS语法里，如果想要遍历一个列表（数组），比如下面这个userList: const userList = [ { id: 1, name: "Kevin", age: 10, subject: 5, state: 1, },{ id: 2, name: "John", age: 15, subject: 1, state: 0, },{ id: ...
es6子数组过滤父数组过滤
09-09
es6提供了对数组的过滤和筛选的方法，可以通过子数组过滤父数组。 假设有一个父数组parentArr和一个子数组childArr，我们想要在父数组中过滤出子数组中的元素。 使用es6的filter方法可以轻松实现这一任务。filter...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值