美文网首页
数组超实用的常见方法:find、findIndex、some、e

数组超实用的常见方法:find、findIndex、some、e

作者: 坏丶毛病 | 来源:发表于2020-11-09 09:36 被阅读0次

    这里介绍几个数组常用的而且超级实用的方法,主要都是用来获取数组中符合条件的某个值

    1、find:给定条件,返回数组中第一个满足该条件的值,之后的值不再进行检测,当没有找到满足该条件的值时,返回undefined

    let arr = [
        {
          name: '小明',
          sex: '男',
          age: 23
        },
        {
          name: '小红',
          sex: '女',
          age: 18
        },
        {
          name: '小兰',
          sex: '女',
          age: 21
        },
        {
          name: '小黑',
          sex: '男',
          age: 23
        }
      ];
    
    const findResult = arr.find((value, index, arr) => {
        console.log(value);
        return (value.age === 23);
    });
    
    console.log(findResult); // {name: "小明", sex: "男", age: 23}
    

    以上代码给定条件,当数组当前的值的age属性等于23时,返回该值。从数据中我们可以看到,有2项值符合该条件,但是find会找到第一个符合该条件的值,最终返回了第一个符合该条件的所对应的数据 小明,且后面的值不再进行检测

    image

    2、findIndex:给定条件,返回数组中第一个满足该条件的值的下标,之后的值不再进行检测,当没有找到满足该条件的值时,返回 -1

    let arr = [{
          name: '小明',
          sex: '男',
          age: 23
        },
        {
          name: '小红',
          sex: '女',
          age: 18
        },
        {
          name: '小兰',
          sex: '女',
          age: 21
        },
        {
          name: '小黑',
          sex: '男',
          age: 23
        }
      ];
    
    const findIndexResult = arr.findIndex((value, index, arr) => {
        console.log(value);
        return (value.age === 23);
    });
    
    console.log(findIndexResult); // 0
    

    以上代码给定条件,当数组当前的值的age属性等于23时,返回该值所对应的下标。从数据中我们可以看到,有2项值符合该条件,但是find会找到第一个符合该条件的值的下标,最终返回了第一个符合该条件的所对应的数据的下标,且后面的值不再进行检测

    image

    3、some:给定条件,只要数组中有一个值满足该条件,就返回true,之后的值不再进行检测,如果没有满足条件的值,返回false

    let arr = [{
          name: '小明',
          sex: '男',
          age: 23
        },
        {
          name: '小红',
          sex: '女',
          age: 18
        },
        {
          name: '小兰',
          sex: '女',
          age: 21
        },
        {
          name: '小黑',
          sex: '男',
          age: 23
        }
      ];
    
    const someResult = arr.some((value, index, arr) => {
        console.log(value);
        return value.age <= 20;
    });
    
    console.log(someResult); // true
    

    以上代码给定条件,判断数组中是否存在值的age属性小于等于20时,只要有一个值满足该条件,就返回true,从数据中我们可以看到小红所对应的数据满足该条件,返回了true,并且后面的值也不再进行检测

    image

    4、every:给定条件,只有当数组中所有值都满足该条件,才返回true,当有值不符合该条件时,返回false,之后的值不再进行检测

    let arr = [{
          name: '小明',
          sex: '男',
          age: 23
        },
        {
          name: '小红',
          sex: '女',
          age: 18
        },
        {
          name: '小兰',
          sex: '女',
          age: 21
        },
        {
          name: '小黑',
          sex: '男',
          age: 23
        }
      ];
    
    const everyResult = arr.every((value, index, arr) => {
        console.log(value);
        return value.age <= 20;
    });
    
    console.log(everyResult); // false
    

    以上代码给定条件,判断数组中是否所有值的age属性小于等于20时,只要有一个值不满足该条件,就返回false,从数据中我们可以看到小红所对应的数据不满足该条件,最终返回了false,并且后面的值也不再进行检测

    image

    以上四个方法的执行函数都接受3个参数:

    | currentValue | 必需。当前元素 |
    | index | 可选。当前元素的索引值 |
    | arr | 可选。当前元素所属的数组对象 |

    好了,以上就是这四个数组方法的介绍以及使用。

    如有问题,请指出,接受批评。

    相关文章

      网友评论

          本文标题:数组超实用的常见方法:find、findIndex、some、e

          本文链接:https://www.haomeiwen.com/subject/npflbktx.html