前端经常需要通过javaScript对数组中的数据进行处理,其中包括检查数组中是否包含满足特定搜索条件的单个或多个值,这就需要我们确认A布尔值for,数组中的值位置索引,或包含所有搜索结果的单独数组等。在ECMAScript6之前,遍历数组中的所有项目并对项目执行操作的最常见方法是通过for循环.我们现在可以通过内置的use方法完成在数组中搜索值的常见任务。本文介绍方法Array.includes()、Array.indexOf()、Array.fiind()和Array.filter。根据数组中是否有值使用includes(),includes()方法会返回true或false基本语法:第一个参数valueToFind为数组中要匹配的值,第二个参数fromIndex可选,使用设置开始比较的索引,因为默认是0,意思是默认搜索整个数组。请参阅鳄鱼事实的示例数组:然后使用includes()检查数组中是否存在字符串“thickscales”代码返回true,因为该字符串存在于数组中。如果在“thickscales”后面加上fromIndex参数进行比较,会返回false另外,还有一些重要的地方需要注意,这里.includes()方法使用的是严格比较,例如:上面代码返回true是因为value80在数组中。上面的代码将返回false,因为字符串值'80'不在数组中。includes()对于只需要知道一个值是否存在于膨胀的数组中的用例很有帮助使用indexOf()indexOf()方法返回数组中值的第一个索引,如果不匹配则返回-1。基本语法如下:查看鳄鱼事实数组示例:使用indexOf()返回字符串“roundedsnout”的第一个索引:返回字符串“roundedsnout”的索引—3上面的代码返回-1因为字符串不在数组中。上面的代码返回1返回4,因为元素是在索引2之后找到的,也就是数组中的第四个元素。注意:如果你不是在寻找第一个结果,你可以使用lastIndexOf(),lastIndexOf()方法和indexOf()类似,但是会从数组的最后一个索引开始寻找第一个出现的和向后工作。indexOf对于需要搜索结果的惰性索引工作很有用。使用find()find()方法返回数组中第一个与函数条件匹配的值,如果没有匹配,则返回undefined基本语法如下:查看鳄鱼事实的示例数组:然后使用find()返回长度小于13的第一个char值:这个例子只使用回调参数。80是一个数值。“roundedsnout”长13个字符,“thickscales”有12个字符,“4foottail”有11个字符——两者都满足函数条件,然而,find()只会返回第一个值,它返回“厚鳞”。下面是一个使用可选索引参数的示例:“thickscales”、“4foottail”和“roundedsnout”都满足第一个条件(typeofel==='string')。如果这是唯一的条件,则返回第一个,即“厚鳞片”。但是因为第二个条件(idx===2),最终代码返回“4foottail”。注意:如果您要查找索引而不是值,您可能会想改用findIndex()。findIndex()方法也接受函数,但它返回匹配元素的索引而不是元素本身。find()对于需要单个搜索结果值的用例很有帮助。使用filter()filter()方法返回一个新数组,其中包含符合函数条件的所有值。如果没有匹配项,则返回一个空数组。基本语法如下:再来一个鳄鱼事实数组示例:然后使用filter()返回所有等于80的值:数组中的两个值80都满足条件。所以返回新数组:[80,80]。filter()对于需要多个搜索结果值的用例很有帮助。总结数组中的两者本文重点介绍Array.includes()、Array.indexOf()、Array.find()和Array.filter。每个都可以为用例需求提供解决方案。只需要知道该值是否存在?这时候就可以使用includes()了。需要获取元素本身?您可以对单个项目使用find()或对多个项目使用filter()。需要找到一个元素的索引?应使用indexOf()搜索原语或使用findIndex()搜索函数。感谢大家阅读!有不懂的问题可以留言。源码附件已打包上传至百度云。可以自行下载~链接:https://pan.baidu.com/s/14G-b...提取码:yu27百度云链接不稳定,随时可能失效,请及时保存。如果百度云链接失效请留言告诉我,我看到后会及时更新~开源地址码云地址:http://github.crmeb.net/u/defuGithub地址:http://github.crmeb。net/u/defu开源不易,Star表示敬意,有兴趣的朋友欢迎Star,提交PR,共同维护开源项目,造福更多人!
