zoukankan      html  css  js  c++  java
  • 关于js查找和筛选和循环的几种方式(find();findIndex();filter();some();every();forEach;map();for/in)

    find();

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

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

    • 当数组中的元素在测试条件时返回 true 时, find() 返回符合条件的元素,之后的值不会再调用执行函数。
    • 如果没有符合条件的元素返回 undefined

    注意: find() 对于空数组,函数是不会执行的。

    注意: find() 并没有改变数组的原始值。

    [1,2,3,4,5,6].find((n) => n < 5)
    //找出数组中第一个大于5 的成员
    // 6
    array.find(function(currentValue, index, arr),thisValue)
    currentValue : 必需。当前元素
    index:可选。当前元素的索引值
    arr: 可选。当前元素所属的数组对象
    thisValue: 可选。 传递给函数的值一般用 "this" 值。
    如果这个参数为空, "undefined" 会传递给 "this" 值

    findIndex();

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

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

    • 当数组中的元素在测试条件时返回 true 时, findIndex() 返回符合条件的元素的索引位置,之后的值不会再调用执行函数。
    • 如果没有符合条件的元素返回 -1

    注意: findIndex() 对于空数组,函数是不会执行的。

    注意: findIndex() 并没有改变数组的原始值。

    [3,10,18,19].findIndex((n) => n >= 18)
    //返回符合条件的值的位置(索引)
    // 2
    array.findIndex(function(currentValue, index, arr),thisValue)
    currentValue : 必需。当前元素
    index:可选。当前元素的索引值
    arr: 可选。当前元素所属的数组对象
    thisValue: 可选。 传递给函数的值一般用 "this" 值。
    如果这个参数为空, "undefined" 会传递给 "this" 值

    filter();

    filter() 方法创建一个新的数组,新数组中的元素是通过检查指定数组中符合条件的所有元素。(返回数组,包含了符合条件的所有元素。如果没有符合条件的元素则返回空数组。)

    注意: filter() 不会改变原始数组。

    注意: filter() 不会对空数组进行检测。

    var arr = [1,2,3,4,5,6,7]
    var newArr = arr.filter(item => item > 5);
    console.log(newArr); //[6, 7]
    array.filter(function(currentValue, index, arr),thisValue)
    currentValue : 必需。当前元素
    index:可选。当前元素的索引值
    arr: 可选。当前元素所属的数组对象
    thisValue: 可选。 传递给函数的值一般用 "this" 值。
    如果这个参数为空, "undefined" 会传递给 "this" 值
    //数组去重
    var arr = [1,2,2,3,4,4,5,6,6,7,8,8,9];
    var newArr = arr.filter((x, index,self)=>self.indexOf(x) === index)  
    console.log(newArr); // [1, 2, 3, 4, 5, 6, 7, 8, 9]

     

    // 1.筛选出两个数组不同的元素
    
    let list= [];
    list = this.array1.filter(item=>{
        return array2.indexOf(item) === -1
    });
    

    // 2.筛选出两个数组相同的元素 let list= []; list = this.array1.filter(item=>{ return array2.indexOf(item) !== -1 })

     

     

    indexOf();

    indexOf() 方法可返回某个指定的字符串值在字符串中首次出现的位置。

    注释:indexOf() 方法对大小写敏感!

    注释:如果要检索的字符串值没有出现,则该方法返回 -1。

    lastIndexOf() 方法可返回一个指定的字符串值最后出现的位置,在一个字符串中的指定位置从后向前搜索。

    stringObject.indexOf(searchvalue,fromindex)
    该方法将从头到尾地检索字符串 stringObject,看它是否含有子串 
    searchvalue。开始检索的位置在字符串的 fromindex 处或字符串的开头(没
    有指定 fromindex 时)。如果找到一个 searchvalue,则返回 searchvalue
    的第一次出现的位置。stringObject 中的字符位置是从 0 开始的。
    var str= "aaa456ac";
    console.log(arr.indexOf('b')); // -1 ,  字符b第一次出现的位置,没有,返回-1;
    console.log(arr.indexOf('a')); // 0 ,  字符a第一次出现的位置,是 0
    console.log(arr.indexOf('a', 3)); //  6,   从第四个字符位置开始往后继续查找,包含当前位置  
    console.log(arr.indexOf('ac', 3)); //  6,   字符串ac第一次出现的位置
    console.log(arr.lastIndexOf('a')); //  6,   字符串a最后出现的位置
     

    some() ;

    some() 方法用于检测数组中的元素是否满足指定条件(函数提供)。

    some() 方法会依次执行数组的每个元素:

    • 如果有一个元素满足条件,则表达式返回true , 剩余的元素不会再执行检测。
    • 如果没有满足条件的元素,则返回false。

    注意: some() 不会对空数组进行检测。

    注意: some() 不会改变原始数组。

    array.some(function(currentValue,index,arr),thisValue)

    var arr = [1,2,3,4,5,6,7]
    var isHas = arr.some(item => item > 5);
    console.log(isHas ); //  true
    var isHas2 = arr.some(item => item > 7);
    console.log(isHas2 ); //  false

    every() ;

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

    every() 方法使用指定函数检测数组中的所有元素:

    • 如果数组中检测到有一个元素不满足,则整个表达式返回 false ,且剩余的元素不会再进行检测。
    • 如果所有元素都满足条件,则返回 true。

    注意: every() 不会对空数组进行检测。

    注意: every() 不会改变原始数组。

    array.every(function(currentValue,index,arr), thisValue)

    var arr = [1,2,3,4,5,6,7]
    var isHas = arr.every(item => item > 5);
    console.log(isHas ); //  false
    var isHas2 = arr.every(item => item < 8);
    console.log(isHas2 ); //  true

    JavaScript 循环

    for - 多次遍历代码块

    for/in - 遍历对象属性

    while - 当指定条件为 true 时循环一段代码块

    do/while - 当指定条件为 true 时循环一段代码块

    for (i = 0; i < 5; i++) {
         text += "数字是 " + i + "<br>";
        console.log(text); // 0,1,2,3,4
    } 

    For/In 循环

    JavaScript for/in 语句遍历对象的属性:

    for/in 遍历对象时, key表示对象的属性;

    var person = {fname:"Bill", lname:"Gates", age:62}; 
    
    var text = "";for (var key in person) {
        text += person[key] + "-";
    }
    console.log(text); // Bill-Gates-62

    for/in 遍历数组时, key表示数组的index索引;

    var arr = [20,40,50]; 
    
    var text = "";
    for (var key in arr ) {
        text += arr[key] + "-";
    }
    console.log(text); // 20-40-50

    For/Of 循环

    for of 循环是 Es6 中新增的语句,用来替代 for in 和 forEach,它允许你遍历 Arrays(数组), Strings(字符串), Maps(映射), Sets(集合)等

    可迭代(Iterable data)的数据结构,注意它的兼容性。

    let arr = [1,2,3];
    for(let i of arr){
     console.log(i)
    }
    // 1
    // 2
    // 3

    forEach();

    forEach() 方法用于调用数组的每个元素,并将元素传递给回调函数。

    注意: forEach() 对于空数组是不会执行回调函数的。

    array.forEach(function(currentValue, index, arr), thisValue)

    var arr = [1,2,3,4] ;
    arr.forEach(function(item,index, myarr){
      console.log(item);
       // 1
       // 2
       // 3
       // 4
       // myarr: [1,2,3,4] 
    });

    map();

    map() 方法返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值。

    map() 方法按照原始数组元素顺序依次处理元素。

    注意: map() 不会对空数组进行检测。

    注意: map() 不会改变原始数组。

    array.map(function(currentValue,index,arr), thisValue)

    var numbers = [4, 9, 7, 5];
     
    var newArr= numbers .map(function (item) {  //接收新数组
          return item * 2;
    });
     
    console.log(newArr); // [8, 18, 14, 10];
  • 相关阅读:
    c#驱动操作mongodb辅助类MongoDBHelper
    c#多线程lock无效
    利用Aspose.Words将html转成pdf和将html转成word
    前后端值映射的问题
    本机部署流程详解
    Git 安装配置手册
    js对象数组(JSON) 根据某个共同字段 分组
    jquery中的$.fn的用法
    JSON.parse()与JSON.stringify()的区别
    添加编辑 时 数据不可重复验证
  • 原文地址:https://www.cnblogs.com/lvsk/p/11955937.html
Copyright © 2011-2022 走看看