Array.includes()一看就会,一用就废

66 阅读1分钟

持续创作,加速成长!这是我参与「掘金日新计划 · 10 月更文挑战」的第6天,点击查看活动详情

我们在日常开发过程中,Array.includes()是经常被使用的,那到底怎么使用呢?有没有什么坑呢?本文就浅谈一下。

主要用法:Array.includes(value,index) 用来判断数组是否含有传入的value,满足返回true;否则返回false;若数组为空
数组,则返回false;传入index参数,表示在数组的第index下标处进行判断;不传index参数,表示数组的所有元素都要被判断;
index不是必传参数;

image.png

image.png

image.png

注意: 在使用includes的时候,有两个误区,很多同学都会犯;

  1. 传入的value必须是基础类型的数据,比如String、Number等;不然返回的都是false, 例如:传入一个函数,结果都会返回false

image.png

  1. 用来被判断的数组的每一项元素一定要是基础类型,不可以用object复杂类型的数据来当数组的元素

image.png

来分析一下为什么会返回false?因为传入的{a: '1', b: '干货'}是一个object,它虽然看上去和 arr[0]所有的键值对都一样,但他们空间地址不一样,所以都会返回false

那数组含有object类型的元素,这种数组,如何使用includes来判断数组arr中是否有属性a==='1'的元素呢?其实很简单,将arr中所有元素的a的值取出来放在一个数组里,再用includes去判断;

image.png

PS: 本文只是浅谈一下includes在开发过程中最常使用的方法与场景,更详细的请看MDN官方文档

developer.mozilla.org/zh-CN/docs/…