数组遍历的方法(forEach,map,filter)

129 阅读2分钟

forEach

forEach(function (v, i){用于调用数组的每个元素,并将元素传递给回调函数。原数组不变})

       let arr = [9, -2, -9, 30, 10, 20, 0]
        // 让arr的数组加+10,并返回新数组
        let newArr = []
        // v:value值  i:索引
        arr.forEach(function (v, i) {
        // v + 10 推入到新数组中 newArr.push()
            newArr.push(v + 10)
        })
        console.log(newArr);
        //打印结果为[19, 8, 1, 40, 20, 30, 10]
    //统计字符串中字母出现的次数
    let str = 'aaabbbbbbccdeeeeff'
    // 字符串转数组
    let arr = str.split('')
    //console.log(arr);

    // 声明一个空对象
    let obj = {}
    arr.forEach(function (v, i) {
        // 判断 如果obj中有对应的属性名 我们就+1 如果没有 就创建一个键值对
        if (obj[v]) {
            obj[v] += 1
        } else {
            obj[v] = 1
        }
    })
    console.log(obj);

map

map(function (v, i){ }),原数组的每一项执行函数后,返回一个新的数组。原数组不变

       //一、 给数组当中的每一项 都加 10 返回一个新数组
       let arr = [4, 9, 0, 10, 240, -12, 98]
       //与forEach不同的是,map在执行函数后,返回一个新的数组
       let newArr = arr.map(function (v, i) {
           return v + 10
       })
       console.log(arr);
       //原数组不变[4, 9, 0, 10, 240, -12, 98]
       console.log(newArr);
       //新数组+10后的打印结果[14, 19, 10, 20, 250, -2, 108]
    // 二、 数组补零并返回新数组(个位数补0返回新数组)
    let arr = ['13', '3', '79', '1', '10', '24', '78', '2']
    let newArr = arr.map(function (v, i) {
    // +v转换为数字类型,当数值 > 10时输出原数字,当数字 < 10时执行补'0'操作
        return +v < 10 ? '0' + v : v
    })
    console.log(newArr);
    // 打印结果为['13', '03', '79', '01', '10', '24', '78', '02']
       // 让所有对象的age+1
        let arr = [{
            name: '李狗蛋',
            age: 16,
            sex: '男'
        }, {
            name: '钟玉龙',
            age: 58,
            sex: '老妇女'
        }, {
            name: '赵铁柱',
            age: 25,
            sex: '男'
        }, {
            name: '王小二',
            age: 19,
            sex: '男'
        }]

        let newArr = arr.map(function (v, i) {
            // v.age = v.age + 1 也可以用v.age+=1
            v.age += 1
            return v
        })
        console.log(newArr); 

filter 过滤

filter(function(v,i){}),过滤数组中,符合条件的元素并返回一个新的数组

        //去除数组中的空字符串和 数字0
        let arr = [13, 0, '', 90, 78, '', '']
        let newArr = arr.filter(function (v, i) {
            // return 符合推入新数组的条件->布尔值(过滤)
            return v !== '' && v !== 0
        })
        console.log(newArr); 
        //打印结果为 [13, 90, 78]
    // 删除数组中相同的数字
    let arr = [1, 1, 2, 3, 4, 4, 5, 6, 6, 6, 6, 7, 7, 8, 9, 9, 9]
    let newArr = arr.filter(function (v, i) {
        // console.log(i);
        // i 数组当中每一项的索引值
        // console.log(arr.indexOf(V));

        // 第一轮 arr.indexOf(1) -> 0   i -> 0
        // 第二轮 arr.indexOf(1) -> 0   i -> 1
        // 第三轮 arr.indexOf(2) -> 2   i -> 2
        return arr.indexOf(v) === i
    })
    console.log(newArr);
    //打印结果为[1, 2, 3, 4, 5, 6, 7, 8, 9]