ES6中Array.find()和findIndex()函数用法详解

发布时间:2019-08-09 发布网站:脚本宝典
脚本宝典收集整理的这篇文章主要介绍了ES6中Array.find()和findIndex()函数用法详解脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。
ES6为Array增加了find(),findIndex函数。find()函数用来查找目标元素,找到就返回该元素,找不到返回undefined,而findIndex()函数也是查找目标元素,找到就返回元素的位置,找不到就返回-1。
他们的都是一个查找回调函数。
查找函数有三个参数。
value:每一次迭代查找的数组元素。
index:每一次迭代查找的数组元素索引。
arr:被查找的数组。

假如我们给vue组件绑定了一个班级的学生列表数据。其数据结构可能如下格式,如果你想从以下数据中查找出姓名为李四的学生的信息。

VAR stu = [
    {
        name: '张三',
        gender: '男',
        age: 20
    },
    {
        name: '王小毛',
        gender: '男',
        age: 20
    },
    {
        name: '李四',
        gender: '男',
        age: 20
    }
]

关于find()的使用

find()方法返回数组中符合测试函数条件的第一个元素。否则返回undefined
在这儿需要注意的几个点:
①、第一个元素
②、测试函数
function getStu(element){
   return element.name == '李四'
}
stu.find(getStu)
//返回结果为  {name: "李四", gender: "男", age: 20}

结合es6的改进

stu.find((element) => (element.name == '李四')); //返回的是{name: "李四", gender: "男", age: 20}这个元素
stu.findIndex((element)=>(element.name =='李四'));  //返回的是索引下标:2

脚本宝典总结

以上是脚本宝典为你收集整理的ES6中Array.find()和findIndex()函数用法详解全部内容,希望文章能够帮你解决ES6中Array.find()和findIndex()函数用法详解所遇到的问题。

如果觉得脚本宝典网站内容还不错,欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。