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);
    
  • 相关阅读:
    各国语言缩写列表,各国语言缩写-各国语言简称,世界各国域名缩写
    How to see log files in MySQL?
    git 设置和取消代理
    使用本地下载和管理的免费 Windows 10 虚拟机测试 IE11 和旧版 Microsoft Edge
    在Microsoft SQL SERVER Management Studio下如何完整输出NVARCHAR(MAX)字段或变量的内容
    windows 10 x64系统下在vmware workstation pro 15安装macOS 10.15 Catelina, 并设置分辨率为3840x2160
    在Windows 10系统下将Git项目签出到磁盘分区根目录的方法
    群晖NAS(Synology NAS)环境下安装GitLab, 并在Windows 10环境下使用Git
    使用V-2ray和V-2rayN搭建本地代理服务器供局域网用户连接
    windows 10 专业版安装VMware虚拟机碰到的坑
  • 原文地址:https://www.cnblogs.com/jianjie/p/12434860.html
Copyright © 2011-2022 走看看