ES6 find 和 filter 的区别 :

遇到个功能是要分类就想说在前端过滤,不要从查数据库的时候过滤了。然后就想说除了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返回全部结果仍然是数组。

注:以后遇到问题,不忙的时候立马就记下来,方便以后查找,不论简单还是难。

ES6 find 和 filter 的区别的更多相关文章

  1. js es6 map 与 原生对象区别

    区别 object和Map存储的都是键值对组合.但是: object的键的类型是 字符串: map的键的类型是 可以是任意类型: 另外注意,object获取键值使用Object.keys(返回数组): ...

  2. ES6 map与filter

    ES6 map与filter 1.map let arr1 = [1,2,3]; let arr2 = arr1.map((value,key,arr) => { console.log(val ...

  3. es6 模块与commonJS的区别

    在刚接触模块化开发的阶段,我总是容易将export.import.require等语法给弄混,今天索性记个笔记,将ES6 模块知识点理清楚 未接触ES6 模块时,模块开发方案常见的有CommonJS. ...

  4. JS002. map( ) 和 filter( ) 的区别和实际应用场景(递归函数、深度优先搜索DFS)

    在开发过程中难免会碰到省市区级联的操作,一般后端人员是不愿意将中文储存在数据库的. 由于应用页面较多,我们在通过区域Code写查字典函数时应该注意函数的 时间复杂度 / 空间复杂度. 如果用三层for ...

  5. CommonJS与ES6 Module的使用与区别

    CommonJS与ES6 Module的使用与区别 1. CommonJS 1.1 导出 1.2 导入 2. ES6 Module 2.1 导出 2.2 导入 3. CommonJS 与 ES6 Mo ...

  6. ES5的继承和ES6的继承有什么区别?让Babel来告诉你

    如果以前问我ES5的继承和ES6的继承有什么区别,我一定会自信的说没有区别,不过是语法糖而已,充其量也就是写法有区别,但是现在我会假装思考一下,然后说虽然只是语法糖,但也是有点小区别的,那么具体有什么 ...

  7. ES6中的find与filter的区别

    一直以来以为find和filter是一样的效果,最近在梳理,才发现是不一样的. 首先,filter和find区别:filter返回的是数组,find返回的是对象. 注意:find()找到第一个元素后就 ...

  8. jquery find()和filter()的区别

    在写js查找当前标签下某一子元素的子元素集合时,用到了此方法 $(".flyout-trigger").mouseover(function(){ var maxnum=$(thi ...

  9. es6 export 和 export default区别

    相信很多人都使用过export.export default.import,然而它们到底有什么区别呢? 在JavaScript ES6中,export与export default均可用于导出常量.函 ...

随机推荐

  1. k3 cloud套打模板中绑定加税合价字段的时候数据都为空,不绑定的时候显示正常

    检查bos中加税合计字段,是不是关联币别绑定错误

  2. 如何利用Chrome进行跨域调试

    为什么要跨域调试: 拿嵌入式web开发说,代码都是跑在板子上,我一个优雅的前端开发要每次改完代码都打包到板子上,用板子的地址打开,这是人做的事??? 怎么跨域调试: 1.升级Chrome为最新版本 2 ...

  3. node开发一个接口详细步骤

    最近在做后台系统改版,由于目前接口还没出来,就自己用nodejs写了个简单的接口. 我这里用的是nodejs+mysql的 这里不讲nodejs和mysql的安装.这些基础略过. 首先创建文件夹.cd ...

  4. Storm简介——初始Storm

    一.什么是Storm Strom是由Twitter开源的类似于Hadoop的实时数据处理框架.Strom是分布式流式数据处理系统,强大的分布式集群管理.便捷的针对流式数据的编程模型.高容错保障这些都是 ...

  5. 2018团队项目beta阶段成果汇总

    2018团队项目beta阶段成果汇总   第一组:二手书 团队博客:http://www.cnblogs.com/DeltaFish/ 博客汇总:https://www.cnblogs.com/Del ...

  6. python基础--2 字符串

    整型 int python3里,不管数字多大都是int类型 python2里面有长整型long 将整型字符串转换为数字 # a='123' # print(type(a),a) # b=int(a) ...

  7. 阿里云ECS VSFTP上传本地文件

    开始终端 购买云服务,获得公网IP,内网IP 控制台首页获得 获得终端连接密码 连接终端,输入连接密码 获得终端界面,进入终端 上传文件 ## .安装VSFTP服务器程序 yum install vs ...

  8. 前端每日实战:25# 视频演示如何用纯 CSS 创作一个慧星拖尾效果的 loader 动画

    效果预览 按下右侧的"点击预览"按钮可以在当前页面预览,点击链接可以全屏预览. https://codepen.io/comehope/pen/YLRLaM 可交互视频教程 此视频 ...

  9. 【leetcode】1089. Duplicate Zeros

    题目如下: Given a fixed length array arr of integers, duplicate each occurrence of zero, shifting the re ...

  10. Android逆向之旅---解析编译之后的Resource.arsc文件格式

    一.前言 快过年了,先提前祝贺大家新年快乐,这篇文章也是今年最后一篇了.今天我们继续来看逆向的相关知识,前篇文章中我们介绍了如何解析Android中编译之后的AndroidManifest.xml文件 ...