zoukankan      html  css  js  c++  java
  • 351 ES5-数组的新方法:forEach,map,filter,some,every,find,findexIndex

    forEach

    forEach() 方法对数组的每个元素执行一次提供的函数。功能等同于for循环.

    应用场景:为一些相同的元素,绑定事件处理器!

    需求:遍历数组["张飞","关羽","赵云","马超"]

    var arr = ["张飞","关羽","赵云","马超"];
    //第一个参数:element,数组的每一项元素
    //第二个参数:index,数组的下标
    //第三个参数:array,正在遍历的数组
    arr.forEach(function(element, index, array){
      console.log(element, index, array);
    });
    

    map

    map() 方法创建一个新数组,其结果是该数组中的每个元素都调用一个提供的函数后返回的结果。

    需求:遍历数组,求每一项的平方存在于一个数组中

    var arr = [1,2,3,4,5];  // 1 4 9 16 25
    //第一个参数:element,数组的每一项元素
    //第二个参数:index,数组的下标
    //第三个参数:array,正在遍历的数组
    //返回值:一个新数组,每个元素都是回调函数的结果。
    var newArray = arr.map(function(element, index, array){
      return element * element;
    });
    console.log(newArray);//[1,4,9,16,25]
    

    filter

    filter用于返回满足条件的元素,
    返回一个新数组,如果在回调函数中返回true,那么就留下来,如果返回false,就扔掉

    需求:遍历数组,将数组中工资超过5000的值删除[1000, 5000, 20000, 3000, 10000, 800, 1500]

    var arr = [1000, 5000, 20000, 3000, 10000, 800, 1500];
    //第一个参数:element,数组的每一项元素
    //第二个参数:index,数组的下标
    //第三个参数:array,正在遍历的数组
    //返回值:一个新数组,存储了所有返回true的元素
    var newArray = arr.filter(function(element, index, array){
      if(element > 5000) {
        return false;
      }else {
        return true;
      }
    });
    console.log(newArray);//[1000, 5000, 3000, 800, 1500]
    
    
    // 优化
    var arr = [1000, 5000, 20000, 3000, 10000, 800, 1500];
    let newArr = arr.filter(item => {
        return item <= 5000
    })
    console.log(newArr) // [1000, 5000, 3000, 800, 1500]
    

    some

    some用于遍历数组,如果有至少一个满足条件,就返回true,否则返回false。

    需求:遍历数组,判断数组是否包含奇数,[2,4,6,8,10,9]

    var arr = [2,4,6,8,10,21];
    //第一个参数:element,数组的每一项元素
    //第二个参数:index,数组的下标
    //第三个参数:array,正在遍历的数组
    //返回值:布尔类型的值,只要有一个回调函数返回true,就返回true
    var flag = arr.some(function(element, index, array){
      console.log(element, index, array);
      if(element %2 == 1){
        return true;
      }else {
        return false;
      }
    });
    console.log(flag);//true
    
    // 优化,一行代码即可
    console.log(arr.some(item => item % 2 != 0))
    

    every

    every用于遍历数组,只有当所有的元素返回true,才返回true,否则返回false。

    需求:遍历数组,判断数组是否都是偶数,[2,4,6,8,10,9]

      var arr = [2,4,6,8,10,21];
      //第一个参数:element,数组的每一项元素
      //第二个参数:index,数组的下标
      //第三个参数:array,正在遍历的数组
      //返回值:布尔类型的值,只有当所有的元素返回true,才返回true,否则返回false。
      var flag = arr.every(function(element, index, array){
        console.log(element, index, array);
        if(element %2 == 0){
          return true;
        }else {
          return false;
        }
      });
      console.log(flag);//false
    

    find

    find() 方法返回数组中满足提供的测试函数的第一个元素的值。否则返回 undefined

    // 获取第一个大于10的数
    var array1 = [5, 12, 8, 130, 44];
    
    var found = array1.find(function(element) {
      return element > 10;
    });
    console.log(found);
    

    findexIndex

    findIndex()方法返回数组中满足提供的测试函数的第一个元素的索引。否则返回-1。

    // 获取第一个大于10的下标
    var array1 = [5, 12, 8, 130, 44];
    
    function findFirstLargeNumber(element) {
      return element > 13;
    }
    
    console.log(array1.findIndex(findFirstLargeNumber));
    

    // forEach()  遍历数组,依次将每个元素 交给回调函数处理  
    // map()      遍历数组,依次将每个元素 交给回调函数处理, 并且会把处理结果存储到一个新数组中,作为返回值进行返回
    // filter()   遍历数组, 返回符合条件元素(数组)
    // some()     判断数组中是否有一个以上元素符合条件;
    // every()    判断数组中每个元素是否都满足条件 
    // find()     查找数组中第一个满足条件的元素
    // findIndex()  查找数组中第一个满足条件的元素的索引值 
    
    let arr = [22, 33, 44, 55, 66];
    arr.forEach(function (当前元素, 索引值, 当前被遍历数组){});
    类似用for循环进行遍历 
    arr.forEach(function (v, i, arr1) {
        // console.log(v, i, arr1);    
        console.log(v * 2);
    });
    
    var arr2 = [];
    arr.forEach(function (v, i) {
       arr2.push(v * 2);
    })
    
    console.log(arr);
    
    let arr = [22, 33, 44, 55, 66];
    //var arr2=[];
    var arr2 = arr.map(function (v, i) {
        return v * 2;
    });
    
    console.log(arr2);
    
    let age = [3, 13, 23, 33, 83, 133];
    
    var r = [];
    age.forEach(function (v, i) {
        if (v >= 18) {
            r.push(v);
        }
    })
    console.log(r);
    遍历数组, 返回符合条件的所有元素(数组)
    let r = age.filter(function (v, i, arr1) {
       return v >= 100;  //条件
    })
    console.log(r);
    
    判断 是否有未成年人 
    let age = [23, 103, 23, 33, 83, 133];
    
    let r = age.some(function (v, i, arr) {
        return v < 1; //判断条件
    })
    console.log(r);
    
    判断是否所有人都是成年人 
    let r = age.every(function (v, i, arr) {
        return v >= 18;
    })
    
    console.log(r);
    
    
    let age = [23, 103, 23, 33, 83, 133];
    
    let r = age.find(function(v) {
        return v > 100;
    })
    
    let index = age.findIndex(function(v) {
        return v > 100;
    })
    
    console.log(r, index);
    
  • 相关阅读:
    Sql获取表中随机1到n条数据
    SQLite相关
    Eclipse自动生成api时报错“警告: 编码 GBK 的不可映射字符”
    Git基础命令
    Oracle查询结果行转列,列转行
    字符串编码方式转换
    Java字符串匹配正则表达式
    python爬虫--编码问题y
    GET与POST方法
    python爬虫(1)--Urllib库的基本使用
  • 原文地址:https://www.cnblogs.com/jianjie/p/12434860.html
Copyright © 2011-2022 走看看