238 ES5新增方法:forEach()、map()、filter()、some()、every()

3.1 数组方法forEach遍历数组

 arr.forEach(function(value, index, array) {
       //参数一是:数组元素
       //参数二是:数组元素的索引
       //参数三是:当前的数组
 })
  //相当于数组遍历的 for循环 没有返回值
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>

<body>
    <script>
        // forEach 迭代(遍历) 数组
        var arr = [1, 2, 3];
        var sum = 0;
        arr.forEach(function(value, index, array) {
            console.log('每个数组元素' + value);
            console.log('每个数组元素的索引号' + index);
            console.log('数组本身' + array);
            sum += value;
        })
        console.log(sum);
    </script>
</body>

</html>

3.2 数组方法filter过滤数组

array.filter(function(currentValue, index, arr))

(1) filter() 方法创建一个新的数组,新数组中的元素是通过检查指定数组中符合条件的所有元素,主要用于筛选数组
(2) 注意它直接返回一个新数组
(3) currentValue: 数组当前项的值
(4) index:数组当前项的索引
(5) arr:数组对象本身
  var arr = [12, 66, 4, 88, 3, 7];
  var newArr = arr.filter(function(value, index,array) {
     //参数一是:数组元素
     //参数二是:数组元素的索引
     //参数三是:当前的数组
     return value >= 20;
  });
  console.log(newArr);//[66,88] //返回值是一个新数组
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>

<body>
    <script>
        // filter 筛选数组
        var arr = [12, 66, 4, 88, 3, 7];
        var newArr = arr.filter(function(value, index) {
            // return value >= 20;
            return value % 2 === 0;
        });
        console.log(newArr);  // [12, 66, 4, 88]
    </script>
</body>

</html>

3.3 数组方法some

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

(1)some() 方法用于检测数组中的元素是否满足指定条件. 通俗点 查找数组中是否有满足条件的元素
(2)注意它返回值是布尔值, 如果查找到这个元素, 就返回true , 如果查找不到就返回false.
(3)如果找到第一个满足条件的元素,则终止循环. 不在继续查找.
(4)currentValue: 数组当前项的值
(5)index:数组当前项的索引
(6)arr:数组对象本身
some 查找数组中是否有满足条件的元素
 var arr = [10, 30, 4];
 var flag = arr.some(function(value,index,array) {
    //参数一是:数组元素
     //参数二是:数组元素的索引
     //参数三是:当前的数组
     return value < 3;
  });
console.log(flag);//false返回值是布尔值,只要查找到满足条件的一个元素就立马终止循环
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>

<body>
    <script>
        // some 查找数组中是否有满足条件的元素
        // var arr = [10, 30, 4];
        // var flag = arr.some(function(value) {
        //     // return value >= 20;
        //     return value < 3;
        // });
        // console.log(flag);

        var arr1 = ['red', 'pink', 'blue'];
        var flag1 = arr1.some(function(value) {
            return value == 'pink';
        });
        console.log(flag1);  // true

        // 1. filter 也是查找满足条件的元素 返回的是一个数组 而且是把所有满足条件的元素返回回来
        // 2. some 也是查找满足条件的元素是否存在  返回的是一个布尔值 如果查找到第一个满足条件的元素就终止循环
    </script>
</body>

</html>

原文地址:https://www.cnblogs.com/jianjie/p/12227136.html

时间: 2024-08-17 14:42:00

238 ES5新增方法:forEach()、map()、filter()、some()、every()的相关文章

ES5 新增方法概述

ES5 新增方法概述 ES5 中给我们创建了一些方法,可以很方便的操作数组或者字符串,这些方法主要包括: 数组方法 字符串方法 对象方法 数组方法 迭代(遍历)方法:forEach().map().filter().some().every() array.forEach(function(currentValue,index,arr)) currentValue:数组当前项的值 index:数组当前项的索引 arr:数组对象本身 相似于 map() return 不会中止循环 rray.fil

数组那些事(slice,splice,forEach,map,filter等等)

周五,再过会要下班了,刚才把<javascript高级程序设计>数组这块又看了下,加深下记忆.今天来继续练练笔,嘿嘿!(写下自己印象不深的东西) 一.数组的定义(数组定义分为两种) 方法一:1 var color=new Array(num);//num为数字,(当然可写,可不写) 表示数组长度 var color=new Array("red","yellow");//直接定义数组内容 方法二: 2.var color=[];//当然也可以定义的时候直

ES5中Array新增加的API接口 forEach map filter some every indexOf lastIndexOf reduce reduceRight

var array = [23,48,66,2]; forEach:循环.遍历数组:没有返回值.与for循环类似 array.forEach(function( value, index, array ) { console.log(value); return value * value; } ); map:映射的意思,映射返回一个新数组,有返回值;filterArr:返回一个新对象 var mapArr = array.map(function(value, index, array ){

forEach, map, filter方法区别

听说for循环已经成了菜鸟标配...? 瑟瑟发抖 赶紧找来资料补一补 1, forEach循环,循环数组中每一个元素并采取操作, 没有返回值, 可以不用知道数组长度 2, map函数,遍历数组每个元素,并回调操作,需要返回值,返回值组成新的数组,原数组不变 3,filter函数, 过滤通过条件的元素组成一个新数组, 原数组不变 4, some函数,遍历数组中是否有符合条件的元素,返回Boolean值 5,every函数, 遍历数组中是否每个元素都符合条件, 返回Boolean值 原文引用:htt

数组方法重写:forEach, map, filter

Array.prototype.myForEach = function(fn) { var arr = this, len = arr.length, arg2 = arguments[1] || window; for(var i = 0; i < len; i++) { fn.apply(arg2, [arr[i], i, arr]); } }; Array.prototype.myFilter = function(fn) { var arr = this, len = arr.leng

处理数组的forEach map filter的兼容性

处理数组的forEach 1 //forEach处理 2 if(!Array.prototype.forEach) { 3 Array.prototype.forEach = function (callback) { 4 for(var i=0,len=this.length;i<len;i++) { 5 callback(this[i], i); 6 } 7 } 8 } 处理数组的map 1 //处理map 2 if(!Array.prototype.map) { 3 Array.proto

js数组遍历some,foreach,map,filter,every对比

1. [...].some(ck)函数       ----      某个一个为true,则为true 对数组中每个元素执行一次ck函数,知道某个元素返回true,则直接返回true.如果都返回false,则返回false 检查整个数组中是否有满足ck函数的元素. var result = [1,5,3,6].some(  (v,i)  =>  (v>10) )      //所有元素都不满足,返回result = false var result = [10,5,30,60].some(

JS中some(),every(),forEach(),map(),filter()区别

map():返回一个新的Array,每个元素为调用func的结果 filter():返回一个符合func条件的元素数组 some():返回一个boolean,判断是否有元素是否符合func条件 every():返回一个boolean,判断每个元素是否符合func条件 forEach():没有返回值,只是针对每个元素调用func API的区别 function my_func(item) { if (item == 1) { console.log('t'); return true; } con

201602061615_《Javascript方法之map();filter();——以前一直很混》

/*"映射的意思,映射为一个新数组,一个经过一定运算的数组"*/ var arr=[1,3,5,6]; var computedArr = arr.map(function(item){ return item*item*item; }); console.log(computedArr); //[1, 27, 125, 216] Filter 创建一个新的匹配过滤条件的新数组. 例-1(无Filter): var arr = [ {"name":"app