美文网首页
map,filter,reduce

map,filter,reduce

作者: RDbaby | 来源:发表于2018-07-24 10:27 被阅读0次

    对于map,filter,reduce这三者之间,用的比较少,也没有做什么整理,导致一直傻傻分不清。今天趁着暂时没啥bug,趁机整理一波,以备不时之需。。
    惭愧惭愧哈。
    话不多说上代码,一切都在注释中。

        <script>
            // map
            let arr=[2,3,4,5];
            let b=arr.map(e=>{
                return e=e*2
            })
            // console.log(arr)//[2,3,4,5]
            // console.log(b)//[4,6,8,10]
            //map不改变原数组,返回一个原数组处理之后的新的数组
            //map 有且必须有return ,否则新数组各项值为undefined
    
    
            // filter
                //深拷贝数组
            let arr2=[...arr]
            // let arr2=arr.slice();
            // let arr2=arr.concat();
            let c=arr2.filter(e=>{
                return e>4
            })
            // console.log(arr2)//[2,3,4,5]
            // console.log(c)//[5]
            //filter 不改变原数组,返回符合条件筛选后的一个新的数组
            //filter 有且必须有return 否则新数组为一个空的数组
            
    
            //reduce
            // 语法 
            // arr.reduce(callback(previousValue, currentValue, currentIndex,array),initialValue); 
            // 参数 
            // callback:累加器函数 
            // previousValue: 上一次调用函数后的返回值,或者是提供的初始值(initialValue) 
            // currentValue:当前数组的元素 
            // currentIndex:当前数组元素的索引 
            // array:调用reduce的数组 
            // initialValue:初始值,作为第一次调用callback的第一个参数,也可不写,默认为0;
            let arr3=[...arr2]
    
            //1.filter累加器
            let d=arr3.reduce((total,e)=>{
                
                return total+=e
            })
            console.log(arr3)//[2,3,4,5]
            console.log(d)//14
            //reduce必须有return 若无return 返回值为undefined
    
            //2.reduce实现filter和map
            let f=arr3.reduce(((total,e)=>{
                //map
                e*=2;
                //filter
                if(e>4){
                    total.push(e)
                }
                return total
            }),[])
            console.log(f)//[6,8,10]
        </script>
    

    相关文章

      网友评论

          本文标题:map,filter,reduce

          本文链接:https://www.haomeiwen.com/subject/zulemftx.html