【ES6】数组新增的四个方法 map reduce filter forEach

map 映射,一个对一个

map( ) 方法按照原始数组元素顺序依次处理元素,返回一个新数组,数组中的元素为原始数组调用函数处理后的值。不改变原始数组。

    let arr = [10,20,30,40]  
    let newArr = arr.map((item, index, args) => { //当前元素、位置、原始数组本身
        console.log(item, index, args) //会执行 arr.length 次
        return item * 2
    })
    console.log(newArr) //[20, 40, 60, 80]

实例1、分数映射是否及格

    let arr = [59,60,89,40]
    let result = arr.map(item => item >= 60 ? '及格' : '不及格')
    alert(result) //[不及格,及格,及格,不及格]

reduce 汇总,一堆出来一个

    let arr = [59,60,89,40]
    let result = arr.reduce(function(totle, item, index, args){
        console.log(totle, item, index, args) //相加中间值、当前值、当前次数、数组本身
        return totle + item
    })
    console.log(result) //248

实例1、求平均值

    let arr = [890, 657, 987, 90]
    let result = arr.reduce(function(totle, item, index){
        if(index == arr.length - 1){ //表示最后一次
            return (totle + item) / arr.length
        }else{
            return totle + item
        }
    })
    console.log(result) //248

filter 过滤器

filter( ) 创建一个新的数组,新数组中的元素是通过检查指定数组中符合条件的所有元素。

    let arr = [13, 28, 87, 65, 99, 9]
    let result = arr.filter(function(item, index, args){
        console.log(item, index, args) //当前元素、元素位置、原始数组
        return item % 3 == 0
    })
    console.log(result) //[87,99,9]

实例1、json数组

    let arr = [
        {name: '男鞋', price: 200},
        {name: '女鞋', price: 18700},
        {name: '男包', price: 100},
        {name: '女包', price: 20000},
    ]
    let result = arr.filter(item => item.price > 10000)
    console.log(result) //[{name: "女鞋", price: 18700},{name: "女包", price: 20000}]

forEach 循环

    let arr = [21, 34, 56, 88, 90]
    arr.forEach((item, index, args) =>{
        console.log(index + ":" + item, args)
    })

forEach 的操作会改变原数组,这是和 map 的区别。

猜你喜欢

转载自blog.csdn.net/meichaoWen/article/details/113940466