【JavaScript】 中reduce方法的运用案例与解析【经典的数组去重与数组扁平化】

89 阅读1分钟

1.本文主要展示在reduce方法中将数组扁平化和数组去重的两个操作,展现reduce方法的强大之处

代码如下:

    //数组扁平化

    //老规矩,创建一个多维数组
    const array = [1,2,[3,[4,5,[6]]]]
    //传入数组参数
    const getFlatArr = function(arr){
      return arr.reduce((pre,cur)=>{
        //利用concat数组拼接方法,判断当前操作元素cur是否为Array,是的话继续递归循环进去,不是的话直接拼接进去pre并返回出去。
        return pre.concat(Array.isArray(cur)?getFlatArr(cur):cur)
      },[])
    }
    const res = getFlatArr(array)
    console.log(res) 
//数组去重
    //创建数组
    const array = [1,2,3,4,2,3,4,5,6,6]
    const delRepeatArr = function(arr){
      //一旦调用就把arr.reduce方法 return出去,因为reduce方法最终运行完会返回一个数组,如果没有return 出去的话就一直留在函数里。外部读取的话就是undefined
      return arr.reduce((pre,cur)=>{
        //利用includes检查pre里是否有与cur重复的元素。
        if(!pre.includes(cur)){
          return pre.concat(cur)
        }
        else{
          //包含cur的话就直接返回原pre,跳入下一次循环。
          return pre
        }
      },[]) //初始值定位一个空数组,pre从空数组开始,cur从index为0的元素开始。
    }
    const res = delRepeatArr(array)
    console.log(res)