iis服务器助手广告广告
返回顶部
首页 > 资讯 > 前端开发 > JavaScript >JS数组方法some、every和find的使用详情
  • 857
分享到

JS数组方法some、every和find的使用详情

2024-04-02 19:04:59 857人浏览 安东尼
摘要

目录1、some2、every3、find1、some 在MDN中这样定义:some()方法测试数组中是不是至少有1个元素通过了被提供的函数测试。它返回的是一个Boolean类型的值

1、some

在MDN中这样定义some()方法测试数组中是不是至少有1个元素通过了被提供的函数测试。它返回的是一个Boolean类型的值。

简而言之就是:它对数组中的每一项进行校验,只要有一项通过了就是true

  • 它只会返回truefalse
  • 它会对数组中的每一项进行检测,千万不要在some里面进行if else操作
  • 不要在return后面写truefalsereturn后面跟的是你的条件

最近做后台管理系统遇到一个需求:弹出一个Dialog,只要这个Dialog里面的input有一个有值,就可以;否则提示至少要有一个值。

数据结构如下,使用some


let arr = [
    { value: "apple" },
    { value: "" },
    { value: "banana" },
    { value: "orange" },
    { value: "" },
]
let res = arr.some(item=>{
    return item.value !== ""
})
console.log(res);

在这里,只要有值,res就为true,所以我们可以在restrue时进行下一步操作。


if (res) {
    console.log("数组有值");
} else {
    console.log("至少输入一个值");
}

2、every

every的使用方法和some一样。 在MDN中:every()方法测试一个数组内的所有元素是否都能通过某个指定函数的测试。它返回一个布尔值。

简而言之就是:它对数组中的每一项进行校验,只要有一项不通过它就是false
注意事项与some一样。 如果要求每一个输入框中都必须有值时,


let arr2 = [
    { value: "apple" },
    { value: "" },
    { value: "banana" },
    { value: "orange" },
    { value: "er" },
]

var res2 = arr2.every(item => {
    return item.value !== ""
})
console.log(res2);

在这里,只要有一项没有值,res2就为false


if (!res2) {
    //res2为真,则走else;为假,则走if
    console.log("输入框有空值");
} else {
    console.log("输入框没空值");
    console.log("进行下步操作");
}

3、find

MDN中,find()方法返回数组中满足提供的测试函数的第一个元素的值。否则返回 undefined
注意:find()和上面两个不一样,它返回的是值,而且是第一个满足条件的值


let arr3 = [
    { value: "" },
    { value: "" },
    { value: "" },
    { value: "" },
    { value: "apple" },
]
var res3 = arr3.find(item => {
    return item.value !== ""
})
console.log(res3);

可以根据find的返回值是否为undefined来判断itemvalue,


if (res3) {
    //res3有值,在这里进行下一步操作。
    console.log("数组中至少有一个值");
} else {
    //res3为undefined
    console.log("数组为空!");
}

到此这篇关于js数组方法some、everyfind的使用详情的文章就介绍到这了,更多相关JS数组方法someeveryfind的使用内容请搜索编程网以前的文章或继续浏览下面的相关文章希望大家以后多多支持编程网!

--结束END--

本文标题: JS数组方法some、every和find的使用详情

本文链接: https://www.lsjlt.com/news/137147.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
  • JS数组方法some、every和find的使用详情
    目录1、some2、every3、find1、some 在MDN中这样定义:some()方法测试数组中是不是至少有1个元素通过了被提供的函数测试。它返回的是一个Boolean类型的值...
    99+
    2024-04-02
  • JS中some和every的区别和用法详解
    JS中some和every的区别和用法 some和every是数组中迭代的方法相同点:some和every都有三个参数,即item→当前项,index→当前的索引...
    99+
    2023-05-19
    js some和every使用 js some和every some every区别
  • 数组some和every是不是es6的方法
    今天小编给大家分享一下数组some和every是不是es6的方法的相关知识点,内容详细,逻辑清晰,相信大部分人都还太了解这方面的知识,所以分享这篇文章给大家参考一下,希望大家阅读完这篇文章后有所收获,下面我...
    99+
    2024-04-02
  • JavaScript数组迭代every和some的操作方法
    这篇文章主要介绍了JavaScript数组迭代every和some的操作方法的相关知识,内容详细易懂,操作简单快捷,具有一定借鉴价值,相信大家阅读完这篇JavaScript数组迭代every和some的操作...
    99+
    2024-04-02
  • ES6数组some()和every()的使用及说明
    目录ES6 数组some()和every()使用ES6数组新增方法1. forEach2.map3.filter4.some5.every6.find 、findLast7.find...
    99+
    2023-01-16
    ES6数组使用 ES6 数组some() ES6 数组every()
  • es6中some和every方法怎么使用
    这篇“es6中some和every方法怎么使用”文章的知识点大部分人都不太理解,所以小编给大家总结了以下内容,内容详细,步骤清晰,具有一定的借鉴价值,希望大家阅读完这篇文章能有所收获,下面我们一起来看看这篇“es6中some和every方法...
    99+
    2023-07-05
  • 简述JS中forEach()、map()、every()、some()和filter()的用法
    目录前言一、forEach(),用于遍历数组,无返回值二、map(),用于遍历数组,返回处理之后的新数组三、every(),用于判断数组中的每一项元素是否都满足条件,返回一个布尔值四...
    99+
    2024-04-02
  • es6中some和every方法使用简单示例
    目录1、some方法举例如下图所示:2、every方法举例:3、回调函数没有(主动)返回4、特殊情况总结一下,有三个重要的点:文章略长,但比较简单。 es6中的数组方法some()和...
    99+
    2023-05-14
    es6 every some es6的some方法 es6 every方法
  • javascript学数组中的foreach方法和some方法
    目录一、foreach方法1直接vs打开2代码部分二、some方法1直接vs打开2代码部分3总结在我们的日常开发中 不免会有很多需要处理数据的方法 本节主要说一说foreach和so...
    99+
    2024-04-02
  • JavaScript中数组reduce()方法使用详情
    语法: reduce()对数组中的每个元素进行累加,返回一个新的值,可以传入初始值简单的讲就是返回数组中所有元素的和数  不会改变原始组的值  不会对空数组执行回...
    99+
    2024-04-02
  • Python中find函数的详细使用方法
    目录一、find函数的官方定义二、find函数的详细函数使用解释总结一、find函数的官方定义 首先,Python的find函数多用在字符串的处理上,也是Python计算机二级的小考...
    99+
    2023-05-20
    python find函数用法 python中find函数 python find 函数
  • JavaScript数组迭代find和findIndex操作的方法
    这篇“JavaScript数组迭代find和findIndex操作的方法”文章的知识点大部分人都不太理解,所以小编给大家总结了以下内容,内容详细,步骤清晰,具有一定的借鉴价值,希望大家阅读完这篇文章能有所收...
    99+
    2024-04-02
  • JS数组降维的方法详解
    本篇内容介绍了“JS数组降维的方法详解”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!JS是什么JS是JavaScript的简称,它是一种直译...
    99+
    2023-06-14
  • JS数组有哪些使用方法
    本篇内容主要讲解“JS数组有哪些使用方法”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“JS数组有哪些使用方法”吧!一、会修改原数组1.push():(在数组结尾处)向数组添加一个新的元素push...
    99+
    2023-06-25
  • js中的数组及数组方法使用是怎样的
    今天就跟大家聊聊有关js中的数组及数组方法使用是怎样的,可能很多人都不太了解,为了让大家更加了解,小编给大家总结了以下内容,希望大家根据这篇文章可以有所收获。Array对象之前一直在温故js系列,希望能够知...
    99+
    2024-04-02
  • js的Map函数使用方法详解
    Map是ES2015引入的Global Object,Map对象中保存了键值对,且任何对象(包括原始值)都可以作为键或者值。 1. 构造函数 Map必须作为构造函数来使用, new ...
    99+
    2024-04-02
  • JS数组中filter方法的使用实例
    目录1、定义2、语法3、参数说明4、用法5、注意事项6、使用实例附:多条件单数据筛选总结1、定义   filter()创建一个新的数组,新数组中的元素是通过检查指...
    99+
    2024-04-02
  • JS数组降维的几种方法详解
    二维数组降维 使用数组实例方法concat和ES6扩展运算符降维 let arr=[1,2,[3,4],5]; let arr1=[].concat(...arr); ...
    99+
    2024-04-02
  • vue中Promise的使用方法详情
    目录一、使用1.promise是一种异步解决方案2.async await简介: promise是什么,它可以说是异步编程的一种解决方法,就拿传统的ajax发请求来说,单个还好,如果...
    99+
    2024-04-02
  • JS中数组的迭代方法和归并方法
    本篇内容介绍了“JS中数组的迭代方法和归并方法”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!数组的迭代方法...
    99+
    2024-04-02
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作