Js根据数组中每个对象中指定属性生成新数组

271 阅读1分钟

后台给的数据是这样的

let arr = [
    {name:'海淀区',upload:10,download:4,preview:5},
    {name:'朝阳区',upload:5,download:10,preview:3},
    {name:'通州区',upload:2,download:16,preview:27},
]

需求是根据后台返回的数据生成上传、预览、下载3个数组

一开始我是这样写的(太low了):

            // let arr1 = []
            // let arr2 = []
            // let arr3 = []
            // arr.map(item => {
            //   let obj = {}
            //   let obj2 = {}
            //   let obj3 = {}
            //   obj.areaname = item.name
            //   obj2.areaname = item.name
            //   obj3.areaname = item.name

            //   obj.count = item.uploadCount 
            //   obj2.count = item.downloadCount 
            //   obj3.count = item.previewCount 
            //   arr1.push(obj)
            //   arr2.push(obj2)
            //   arr3.push(obj3)
            // })

后来实在忍不了优化了一下,直接上代码(js工厂模式)

     structure(arr, attrname) {
        let myArr = []
        arr.map(item => {
          let obj = {}
          obj.name = item.name
          obj.count = item[attrname]
          myArr.push(obj)
        })
        return myArr
      }
      
      let uploadArr = structure(arr,"upload")
      /*
          { name: '海淀区', count: 10 },
          { name: '朝阳区', count: 5 },
          { name: '通州区', count: 2 }
      */
            
      let downArr = structure(arr,"download")
      /*
          { name: '海淀区', count: 4 },
          { name: '朝阳区', count: 10 },
          { name: '通州区', count: 16 }
      */
      
      let prevArr = structure(arr,"preview")
      /*
          { name: '海淀区', count: 5 },
          { name: '朝阳区', count: 3 },
          { name: '通州区', count: 27 }
      */

搞定!