使用lodash的樞軸數據

Question

我需要將init數組轉換爲最終數組，最好使用lodash。

initArray = [ 
    { 
     "date":"2017-08-15", 
     "data":[ 
     { 
      "color":"orange", 
      "count":100 
     }, 
     { 
      "color":"green", 
      "count":101 
     } 
     ] 
    }, 
    { 
     "date":"2017-08-14", 
     "data":[ 
     { 
      "color":"orange", 
      "count":102 
     }, 
     { 
      "color":"green", 
      "count":103 
     } 
     ] 
    } 
] 

finalArray = [ 
    { 
     "color":"orange", 
     "data":[ 
     100, 
     102 
     ] 
    }, 
    { 
     "color":"green", 
     "data":[ 
     101, 
     103 
     ] 
    } 
] 

Answer 1

可以使用reduce拼合原始數組，使所有數據數組是在同一水平上。然後使用_.transform來獲取一個臨時對象將顏色映射到它們的計數數組。然後你可以使用forEach把東西推到finalArray。

var initArray = [ 
 
    { 
 
    "date":"2017-08-15", 
 
    "data":[ 
 
    { 
 
     "color":"orange", 
 
     "count":100 
 
    }, 
 
    { 
 
     "color":"green", 
 
     "count":101 
 
    } 
 
    ] 
 
    }, 
 
    { 
 
    "date":"2017-08-14", 
 
    "data":[ 
 
    { 
 
     "color":"orange", 
 
     "count":102 
 
    }, 
 
    { 
 
     "color":"green", 
 
     "count":103 
 
    } 
 
    ] 
 
    } 
 
]; 
 
var finalArray = []; 
 
var temp = _.transform(initArray.reduce((a,b) => a.data.concat(b.data)), 
 
         (r, v) => (r[v.color] || (r[v.color] = [])).push(v.count), {}); 
 

 
_.forEach(temp, (v,k) => finalArray.push({color:k, count:v})); 
 

 
console.log(finalArray);

<script src="https://cdn.jsdelivr.net/lodash/4/lodash.min.js"></script>

Answer 2

這樣好像lodash電話道理給我。

// var _ = require('lodash') 
 

 
initArray = [ 
 
    { 
 
     "date":"2017-08-15", 
 
     "data":[ 
 
     { 
 
      "color":"orange", 
 
      "count":100 
 
     }, 
 
     { 
 
      "color":"green", 
 
      "count":101 
 
     } 
 
     ] 
 
    }, 
 
    { 
 
     "date":"2017-08-14", 
 
     "data":[ 
 
     { 
 
      "color":"orange", 
 
      "count":102 
 
     }, 
 
     { 
 
      "color":"green", 
 
      "count":103 
 
     } 
 
     ] 
 
    } 
 
] 
 

 
result = _(initArray) 
 
    //.map('data') 
 
    //.flatten() 
 
    .flatMap('data') // instead of .map('data').flatten() 
 
    .groupBy('color') 
 
    .map((item, key) => ({ 
 
     color: key, 
 
     count: _.map(item, 'count') 
 
    })) 
 
    .value() 
 

 
console.log(result)

<script src="https://cdn.jsdelivr.net/lodash/4/lodash.min.js"></script>