zoukankan      html  css  js  c++  java
  • VUE中常用的数组方法

    .filter()、.map()、.forEach()、.find()、.findIndex()、.some()、.every()
    本文仅为自己在项目中经常用到的一些数组方法的使用,以便随时查看。

    .filter()
    filter() 方法创建一个新的数组,新数组中的元素是通过检查指定数组中符合条件的所有元素。
    是否改变原数组:否
    是否对空数组进行检测:否

    语法:

    const arr= [32, 33, 16, 40];
    const arr1 = arr.filter(item => item >= 18)
    console.log(arr) // [32, 33, 16, 40]
    console.log(arr1) // [32, 33, 40]

    .map()
    map() 方法返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值。
    map() 方法按照原始数组元素顺序依次处理元素。
    是否改变原数组:否
    是否对空数组进行检测:否

    语法:

    const arr= [4, 9, 16, 25];
    const arr1 = arr.map(item => item+2)
    console.log(arr) // [4, 9, 16, 25]
    console.log(arr1) // [6, 11, 18, 27]


    .forEach()
    forEach() 方法用于调用数组的每个元素,并将元素传递给回调函数。
    注意: forEach() 对于空数组是不会执行回调函数的。
    tips: forEach()中不支持使用break(报错)和return(不能结束循环),有需要时可使用常规的for循环。

    语法:

    const arr= [4, 9, 16, 25];
    const arr1 = [];
    arr.forEach(item => arr1.push(item))
    console.log(arr) // [4, 9, 16, 25]
    console.log(arr1) // [4, 9, 16, 25]

    .find()
    find() 方法返回通过测试(函数内判断)的数组的第一个元素的值。

    find() 方法为数组中的每个元素都调用一次函数执行:

    当数组中的元素在测试条件时返回 true 时, find() 返回符合条件的元素,之后的值不会再调用执行函数。
    如果没有符合条件的元素返回 undefined
    注意: find() 对于空数组,函数是不会执行的。
    注意: find() 并没有改变数组的原始值。

    语法:

    const arr= [4, 9, 16, 25];
    const b = arr.find(item => item>10)
    const c = arr.find(item => item<1)
    console.log(arr) // [4, 9, 16, 25]
    console.log(b) // 16
    console.log(c) // undefined


    .findIndex()
    findIndex() 方法返回传入一个测试条件(函数)符合条件的数组第一个元素位置。

    findIndex() 方法为数组中的每个元素都调用一次函数执行:

    当数组中的元素在测试条件时返回 true 时, findIndex() 返回符合条件的元素的索引位置,之后的值不会再调用执行函数。
    如果没有符合条件的元素返回 -1
    注意: findIndex() 对于空数组,函数是不会执行的。
    注意: findIndex() 并没有改变数组的原始值。

    语法:

    const arr= [4, 9, 16, 25];
    const b = arr.findIndex(item => item>10)
    const c = arr.findIndex(item => item<1)
    console.log(arr) // [4, 9, 16, 25]
    console.log(b) // 2
    console.log(c) // -1

    .some()
    some() 方法用于检测数组中的元素是否满足指定条件(函数提供)。
    some() 方法会依次执行数组的每个元素:

    如果有一个元素满足条件,则表达式返回true , 剩余的元素不会再执行检测。
    如果没有满足条件的元素,则返回false。
    注意: some() 不会对空数组进行检测。
    注意: some() 不会改变原始数组。

    语法:

    const arr= [4, 9, 16, 25];
    const b = arr.some(item => item>10)
    const c = arr.some(item => item<1)
    console.log(arr) // [4, 9, 16, 25]
    console.log(b) // true
    console.log(c) // false

    .every()
    every() 方法用于检测数组所有元素是否都符合指定条件(通过函数提供)。
    every() 方法使用指定函数检测数组中的所有元素:

    如果数组中检测到有一个元素不满足,则整个表达式返回 false ,且剩余的元素不会再进行检测。
    如果所有元素都满足条件,则返回 true。
    注意: every() 不会对空数组进行检测。
    注意: every() 不会改变原始数组。

    语法:

    const arr= [4, 9, 16, 25];
    const b = arr.every(item => item>10)
    const c = arr.every(item => item>1)
    console.log(arr) // [4, 9, 16, 25]
    console.log(b) // false
    console.log(c) // true



  • 相关阅读:
    虚拟机网络模式
    js读取json包装的map集合
    LeetCode 94:Binary Tree Inorder Traversal
    tornado+ansible+twisted+mongodb运维自己主动化系统开发(四)
    UVA
    解决request.getRemoteAddr()获取的值为0:0:0:0:0:0:0:1这个小问题
    eclipse调试web项目
    Action的mapping.findFoward(forwardName)必须要在struts-config.xml中的对应的action节点配置一个forward节点
    使用struts的时候form用struts的,不用html本身的
    eclipse的源代码编辑窗口可以拖出来单独使用的哦
  • 原文地址:https://www.cnblogs.com/shusonghe/p/15105379.html
Copyright © 2011-2022 走看看