find/some/every/includes：数组查找与判断实战用法｜JS 基础语法与数据操作篇

【find/some/every/includes】数组查找与判断从核心逻辑到落地实操彻底搞懂数组判断的最佳写法避开高频坑 文章目录前言一、先搞清楚find / some / every / includes 在干什么二、数组查找与判断的 10 个常用场景2.1 场景 1找第一个符合条件的对象find2.2 场景 2判断是否至少有一个满足条件some2.3 场景 3判断是否全部满足条件every2.4 场景 4判断数组是否包含某个值includes2.5 场景 5权限判断是否有某个权限some includes2.6 场景 6表单校验是否全部必填项已填every2.7 场景 7勾选状态是否全部选中every2.8 场景 8找第一个并给默认值find ??2.9 场景 9对象数组是否包含某个 idsome2.10 场景 10组合判断全部满足 A 且至少一个满足 Bevery some三、容易踩的坑3.1 find 找不到返回 undefined直接解构会报错3.2 空数组时 every 返回 truesome 返回 false3.3 includes 只能判断简单值对象数组要用 some3.4 find 和 filter 的区别find 只找第一个filter 找全部3.5 some 和 every 的短路特性找到就停四、实战推荐写法模板五、小结 本系列专栏导航同学们好我是 Eugene尤金一个拥有多年中后台开发经验的前端工程师~Eugene 发音很简单/juːˈdʒiːn/大家怎么顺口怎么叫就好你是否也有过明明学过很多技术一到关键时候却讲不出来、甚至写不出来你是否也曾怀疑自己是不是太笨了明明感觉会却总差一口气就算想沉下心从头梳理可工作那么忙回家还要陪伴家人。一天只有24小时时间永远不够用常常感到力不从心。技术行业本就是逆水行舟不进则退。如果你也有同样的困扰别慌。从现在开始跟着我一起心态归零利用碎片时间来一次彻彻底底的基础扫盲。这一次我们一起慢慢来扎扎实实变强。不搞花里胡哨的理论堆砌只分享看得懂、用得上的前端干货咱们一起稳步积累真正摆脱“面向搜索引擎写代码”的尴尬。今天是2026年2月17日农历正月初一在2026 愿大家身体健康无病痛收入翻番钱包鼓代码 0 Error 0 Warning需求一次过上线零回滚策马扬鞭从小白进阶专家新年一路 “狂飙” 给大家拜年啦~前言前端里权限判断、表单校验、勾选状态几乎都要判断「数组里有没有某个值」或「是否全部满足条件」。很多人习惯用for循环 if一把梭或者indexOf判断写多了既啰嗦又容易漏边界情况。用find/some/every/includes这四个方法可以把「查找 → 判断 → 校验」写得更短、更语义化也更好处理边界情况。本文用 10 个常见场景把日常该怎么选、为什么这么选、容易踩的坑讲清楚。⬆ 返回目录一、先搞清楚find/some/every/includes在干什么这四个方法都不是黑魔法本质是在不动原数组的前提下用一次遍历完成「查找 / 判断是否存在 / 判断是否全部满足」。方法在干什么返回值什么时候停find找第一个符合条件的元素找到的元素找不到返回undefined找到第一个就停some判断是否至少有一个满足条件true或false找到第一个就停短路every判断是否全部满足条件true或false遇到第一个不满足就停短路includes判断数组里是否包含某个值严格相等true或false遍历完或找到就停// 传统 for意图分散还要自己管 breakletfoundnull;for(leti0;iusers.length;i){if(users[i].idtargetId){foundusers[i];break;}}// find一眼看出「找第一个 id 匹配的」constfoundusers.find((u)u.idtargetId);记住一点能用语义化方法就不用循环用find/some/every/includes把「要查什么、要判断什么」写清楚比「怎么循环、怎么break」更重要。⬆ 返回目录二、数组查找与判断的 10 个常用场景假设接口返回的数据类似constusers[{id:1,name:张三,role:admin,status:active},{id:2,name:李四,role:user,status:active},{id:3,name:王五,role:user,status:inactive},];constpermissions[read,write,delete];constselectedIds[1,2];下面 10 个写法覆盖权限判断、表单校验、勾选状态等真实场景。⬆ 返回目录2.1 场景 1找第一个符合条件的对象findconstadminusers.find((user)user.roleadmin);// { id: 1, name: 张三, role: admin, status: active }// 找不到返回 undefinedconstsuperAdminusers.find((user)user.rolesuperAdmin);// undefined适用默认选中第一项、取第一个有效配置、根据 id 找对象等。注意find找不到返回undefined后续解构或访问属性要处理用??给默认值。⬆ 返回目录2.2 场景 2判断是否至少有一个满足条件someconsthasAdminusers.some((user)user.roleadmin);// trueconsthasInactiveusers.some((user)user.statusinactive);// true适用权限判断「是否有任一管理员」、表单校验「是否有错误项」、状态判断「是否有未完成项」等。注意空数组时some返回false业务上要结合「空列表算通过还是不算」处理。⬆ 返回目录2.3 场景 3判断是否全部满足条件everyconstallActiveusers.every((user)user.statusactive);// false因为有王五是 inactiveconstallHaveIdusers.every((user)user.id!null);// true适用表单校验「是否全部勾选」、权限判断「是否全部有权限」、状态判断「是否全部完成」等。注意空数组时every返回true空真业务上要结合「空列表算通过还是不算」处理。⬆ 返回目录2.4 场景 4判断数组是否包含某个值includesconsthasReadpermissions.includes(read);// trueconsthasExecutepermissions.includes(execute);// false适用简单值数组的包含判断、权限列表判断、标签列表判断等。注意includes底层用 严格相等做比较这对「简单值string/number/boolean」很友好但对「对象/数组」这类引用类型完全不适用因为比较的是内存地址而非内容。⬆ 返回目录2.5 场景 5权限判断是否有某个权限someincludesconstuserPermissions[read,write];constrequiredPermissiondelete;consthasPermissionuserPermissions.includes(requiredPermission);// false// 或判断多个权限中是否有任一constrequiredPermissions[delete,admin];consthasAnyPermissionrequiredPermissions.some((perm)userPermissions.includes(perm));// false适用按钮权限控制、路由权限控制、功能权限判断等。推荐简单值用includes复杂条件用some 回调。⬆ 返回目录2.6 场景 6表单校验是否全部必填项已填everyconstformFields[{name:username,value:张三,required:true},{name:email,value:,required:true},{name:phone,value:13800138000,required:false},];constallRequiredFilledformFields.filter((field)field.required).every((field)field.value.trim()!);// falseemail 为空适用表单提交前校验、批量操作前校验、多步骤流程校验等。推荐先filter筛出必填项再用every判断是否全部有值。⬆ 返回目录2.7 场景 7勾选状态是否全部选中everyconstcheckboxes[{id:1,checked:true},{id:2,checked:true},{id:3,checked:false},];constallCheckedcheckboxes.every((item)item.checked);// falseconsthasCheckedcheckboxes.some((item)item.checked);// true适用全选/反选功能、批量操作按钮状态、表格多选状态等。推荐every判断全选some判断是否有选中项。⬆ 返回目录2.8 场景 8找第一个并给默认值find??constdefaultUserusers.find((user)user.roleadmin)??{id:0,name:默认用户,role:guest,};适用默认选中第一项、取第一个有效配置、兜底默认值等。注意find 找不到返回undefined用??可以统一成默认对象避免后面解构报错。⬆ 返回目录2.9 场景 9对象数组是否包含某个 idsomeconsttargetId2;constexistsusers.some((user)user.idtargetId);// true// 或判断多个 id 中是否有任一存在consttargetIds[2,5];consthasAnytargetIds.some((id)users.some((user)user.idid));// true2 存在适用判断选中项是否在列表里、判断 id 是否已存在、去重前判断等。注意对象数组不能用includes要用some 条件判断。⬆ 返回目录2.10 场景 10组合判断全部满足 A 且至少一个满足 BeverysomeconstallActiveusers.every((user)user.statusactive);consthasAdminusers.some((user)user.roleadmin);// 业务逻辑全部激活 且 有管理员constcanOperateallActivehasAdmin;// false因为有 inactive 的适用复杂业务规则判断、多条件组合校验、权限组合判断等。推荐把每个条件拆成变量用名字表达「这一步在判断什么」可读性和调试都会好很多。⬆ 返回目录三、容易踩的坑3.1find找不到返回undefined直接解构会报错constuserusers.find((u)u.id999);const{name}user;// TypeError: Cannot read property name of undefined正确用??给默认值或先判断再解构。constuserusers.find((u)u.id999)??{name:未知};// 或constuserusers.find((u)u.id999);if(user){const{name}user;}⬆ 返回目录3.2 空数组时every返回truesome返回false[].every((x)x0);// true空真[].some((x)x0);// false业务上要结合「空列表算通过还是不算」处理。例如表单校验空列表可能应该算「未填写」而不是「通过」。constfields[];constallFilledfields.length0fields.every((f)f.value);// 先判断长度再 every⬆ 返回目录3.3includes只能判断简单值对象数组要用someconstusers[{id:1},{id:2}];users.includes({id:1});// false对象引用不同// 正确用 some 条件判断users.some((user)user.id1);// true⬆ 返回目录3.4find和filter的区别find只找第一个filter找全部constfirstAdminusers.find((u)u.roleadmin);// 返回第一个对象或 undefinedconstallAdminsusers.filter((u)u.roleadmin);// 返回数组可能为空数组 []要「第一个」用find要「全部」用filter别混用。⬆ 返回目录3.5some和every的短路特性找到就停constusers[{id:1,role:admin},{id:2,role:user},{id:3,role:admin},];// some找到第一个 admin 就停不会继续遍历users.some((u){console.log(u.id);// 只打印 1returnu.roleadmin;});// every遇到第一个不是 admin 就停users.every((u){console.log(u.id);// 打印 1, 2遇到 user 就停returnu.roleadmin;});性能上这是好事但如果有副作用如打印、修改外部变量要注意只执行到第一个匹配项。⬆ 返回目录四、实战推荐写法模板权限判断是否有某个权限constuserPermissionsresponse?.data?.permissions??[];constcanDeleteuserPermissions.includes(delete);// 或判断多个权限中是否有任一constcanManage[delete,admin].some((perm)userPermissions.includes(perm));表单校验是否全部必填项已填constfieldsformData?.fields??[];constisValidfields.filter((field)field.required).every((field)field.value?.trim()!);// 或更严格的校验constisValidfields.length0fields.filter((f)f.required).every((f)f.value?.trim()!);勾选状态全选/部分选中constitemstableData??[];constallCheckeditems.length0items.every((item)item.checked);consthasCheckeditems.some((item)item.checked);// 全选按钮状态constselectAllDisableditems.length0;constselectAllCheckedallChecked;找第一个并给默认值constdefaultItem(response?.data?.list??[]).find((item)item.isDefault)??{id:0,name:默认选项,value:,};对象数组是否包含某个 idconstselectedIds[1,2,3];consttargetId2;constisSelectedselectedIds.includes(targetId);// 对象数组constusersresponse?.data?.users??[];consttargetId2;constexistsusers.some((user)user.idtargetId);⬆ 返回目录五、小结场景推荐写法返回值找第一个符合条件的对象list.find(item ...)对象或undefined判断是否至少有一个满足list.some(item ...)true或false判断是否全部满足list.every(item ...)true或false判断是否包含某个值简单值list.includes(value)true或false找第一个并给默认值list.find(...) ?? 默认值对象或默认值对象数组是否包含某个 idlist.some(item item.id id)true或false表单校验全部必填已填list.filter(...).every(...)true或false勾选状态全部选中list.every(item item.checked)true或false记住find负责「找」some负责「至少一个」every负责「全部」includes负责「简单值包含」。日常写权限、校验、状态判断时先想清楚是要找对象、判断存在、判断全部还是简单值包含再选方法代码会干净很多也少踩坑。特别提醒find找不到返回undefined记得用??给默认值空数组时every为truesome为false业务上要结合长度判断对象数组不能用includes要用some 条件判断⬆ 返回目录 本系列专栏导航 JS 基础语法与数据操作一、《var/let/const变量与作用域实战选型JS 基础语法与数据操作篇》二、《this、箭头函数与普通函数前端实战避坑指南 | JS 基础语法与数据操作篇》三、《对象解构赋值接口数据解包 10 个实战写法JS 基础语法与数据操作篇》四、《map/filter/reduce数组10个常用实战操作JS 基础语法与数据操作篇》五、《find/some/every/includes数组查找与判断实战用法JS 基础语法与数据操作篇》六、《sort/localeCompare对象数组排序与分组实战JS 基础语法与数据操作篇》七、《模板字符串 /split/join/ 正则字符串处理实战JS 基础语法与数据操作篇》八、《Date/dayjs日期时间处理实战JS 基础语法与数据操作篇》九、《try/catch/Promise前端错误处理实战JS 基础语法与数据操作篇》十、《import/export前端模块化实战JS 基础语法与数据操作篇》 跟着系列慢慢学把技术功底扎扎实实地打牢 更多内容TS/Vue/工程化等共47篇已整理成「全体系总目录」收藏后可一站式学习 系列总览想系统学习Vue3中后台开发收藏这份「全体系指南」47篇干货从基础到工程化全覆盖《前端基础实战JS/TS与Vue体系化扫盲47 篇完整目录 避坑》 每篇都配套实战场景避坑指南帮你摆脱「面向搜索引擎写代码」的尴尬⬆ 返回目录学习本就是一场持久战不需要急着一口吃成胖子。哪怕今天你只记住了一点点这都是实打实的进步。后续我还会继续用这种大白话、讲实战方式带大家扫盲更多前端基础。关注我不迷路咱们把那些曾经模糊的知识点一个个彻底搞清楚。如果你觉得这篇内容对你有帮助不妨点赞收藏下次写代码卡壳时拿出来翻一翻比搜引擎更靠谱。我是 Eugene你的电子学友我们下一篇干货见