用了这么多年数组的 every 方法,才发现我的理解一直是错的!

前言

大家好,我是林三心,用最通俗易懂的话讲最难的知识点是我的座右铭,基础是进阶的前提是我的初心

背景

今天在开发项目的时候,我的组员造成了一个BUG,原因是用了一个挺常用的数组方法:ervey ,相信大家都见过,或者都用过,它经常跟 some 成双出现,我们理解这两个方法是:

  • every: 判断数组每一项是否符合条件
  • some: 判断数组是否至少有一个符合条件

可以通过一个小例子来认识,我准备了一个用户数组,我分别想做两件事:

  • 1、判断是否所有人都成年了
  • 2、判断是否有人大于20岁

有坑?

再来项目中搞的代码吧,逻辑也跟上述例子差不多,就是通过请求获取一组用户,并判断这组用户是否全都已成年

但是这个代码却出现了BUG,什么呢?就是当 users 是空数组的时候,every 会返回 true!!!不信我们可以看看

我当时看到了,也感觉挺不解的,按理说,every: 判断数组每一项是否符合条件,那如果数组为空的话,那就是没有一个符合条件的,不应是返回 false 吗,不过先不管,先改BUG 先,后面再去想了,加个长度判断,先解决BUG先

空数组,every 返回 true?

我们先来看一下ECMA-262定义的Array.prototype.every

可以看到,every 是判断每一次执行循环函数是否有 false 返回,有的话直接返回 false,如果一个 false 都没有,那就返回 true

关于空数组调用 every() 返回 true 的原因,MDN 网页 提供了答案:

every 的作用就像数学中的"for all"量词。特别是,对于空数组,它返回 true。(地球人都知道,空集的所有元素都满足任何给定的条件。)

空真(Vacuous truth) 是一个数学概念,它意味着若给定条件(称为前提)不能满足(比如给定条件不为真),则某事为真。用 JS 的术语来说,every() 返回 true,是因为它无法调用回调。回调表示要测试的条件,如果因为数组中没有值而无法执行,那么 every() 必须返回 true。

全称量词 是数学中一个更大主题的一部分,它允许您对数据集进行推理。考虑到 JS 数组对于执行数学计算的重要性,尤其是类型化数组,为此类操作提供内置支持是有意义的。every() 不是孤例。

改变思维

以前我人为的:every 判断数组每一项是否符合条件

但是我觉得我不应该那么理解,我应该理解为:every 判断数组是否至少有一个不符合条件,这么去理解的话,自然就能知道为什么空数组是返回 true了,因为就没有不符合条件的,当然就是返回 true 啦~

结语 & 加学习群 & 摸鱼群

我是林三心

  • 一个待过小型toG型外包公司、大型外包公司、小公司、潜力型创业公司、大公司的作死型前端选手;
  • 一个偏前端的全干工程师;
  • 一个不正经的掘金作者;
  • 一个逗比的B站up主;
  • 一个不帅的小红书博主;
  • 一个喜欢打铁的篮球菜鸟;
  • 一个喜欢历史的乏味少年;
  • 一个喜欢rap的五音不全弱鸡

如果你想一起学习前端,一起摸鱼,一起研究简历优化,一起研究面试进步,一起交流历史音乐篮球rap,可以来俺的摸鱼学习群哈哈,点这个,有7000多名前端小伙伴在等着一起学习哦 --> 摸鱼沸点

相关推荐
人工智能训练44 分钟前
【极速部署】Ubuntu24.04+CUDA13.0 玩转 VLLM 0.15.0:预编译 Wheel 包 GPU 版安装全攻略
运维·前端·人工智能·python·ai编程·cuda·vllm
会跑的葫芦怪1 小时前
若依Vue 项目多子路径配置
前端·javascript·vue.js
xiaoqi9222 小时前
React Native鸿蒙跨平台如何进行狗狗领养中心,实现基于唯一标识的事件透传方式是移动端列表开发的通用规范
javascript·react native·react.js·ecmascript·harmonyos
jin1233223 小时前
React Native鸿蒙跨平台剧本杀组队消息与快捷入口组件,包含消息列表展示、快捷入口管理、快捷操作触发和消息详情预览四大核心功能
javascript·react native·react.js·ecmascript·harmonyos
烬头88214 小时前
React Native鸿蒙跨平台实现二维码联系人APP(QRCodeContactApp)
javascript·react native·react.js·ecmascript·harmonyos
pas1364 小时前
40-mini-vue 实现三种联合类型
前端·javascript·vue.js
摇滚侠4 小时前
2 小时快速入门 ES6 基础视频教程
前端·ecmascript·es6
2601_949833394 小时前
flutter_for_openharmony口腔护理app实战+预约管理实现
android·javascript·flutter
珑墨5 小时前
【Turbo】使用介绍
前端
军军君015 小时前
Three.js基础功能学习十三:太阳系实例上
前端·javascript·vue.js·学习·3d·前端框架·three