lodash：組合對象數組

Question

在lodash中，我想將一個對象數組轉換為一個包含每個屬性數組的對象。

我有一個對象數組：

var students = [{
    name: 'A',
    idNo: 1,
    marks: {
        math: 98,
        sci: 97,
        eng: 89
    }
}, {
    name: 'B',
    idNo: 2,
    marks: {
        math: 88,
        sci: 87,
        eng: 79
    }
}, {
    name: 'C',
    idNo: 3,
    marks: {
        math: 87,
        sci: 98,
        eng: 91
    }
}]

我想像這樣組合/重塑它們：

{
    name: [A, B, C],
    idNo: [1, 2, 3],
    marks: [{
            math: 98,
            sci: 97,
            eng: 89
        }, {

            math: 88,
            sci: 87,
            eng: 79            
    }, {
            math: 87,
            sci: 98,
            eng: 91
        }
    }]
}

我希望這完全是用lodash或js內置函數完成的，沒有任何循環。

編輯：我已經按照Nenad的建議實施了一個解決方案。 我想在lodash中使用實用程序功能。

Answer 1

你可以使用lodash的mapValues函數：

var result = _.mapValues(students[0], (value, key) => _.map(students, key));

mapValues使用與作為第一個參數傳遞給它的對象相同的鍵創建一個對象。 這里我們傳遞學生數組students[0]的第一個對象，因此mapValues返回的對象看起來像這樣：

{
    name: ....,
    idNo: ....,
    marks: ....
}

每個鍵的值由傳遞給mapValues作為第二個參數的函數確定。 mapValues將為每個鍵調用此函數並傳遞值和鍵。 我們對該值不感興趣，但是該鍵用於為該鍵中的student數組中的所有值（通過使用鍵作為第二個參數調用map ）。

 var students = [{ name: 'A', idNo: 1, marks: { math: 98, sci: 97, eng: 89 } }, { name: 'B', idNo: 2, marks: { math: 88, sci: 87, eng: 79 } }, { name: 'C', idNo: 3, marks: { math: 87, sci: 98, eng: 91 } }] var result = _.mapValues(students[0], (value, key) => _.map(students, key)); document.getElementById('result').textContent = JSON.stringify(result); 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.15.0/lodash.min.js"></script> <p> <pre id="result"></pre> </p> 

Answer 2

您可以使用帶擴展運算符的_.mergeWith()將數組中的所有對象合並到一個新對象：

 const students = [{"name":"A","idNo":1,"marks":{"math":98,"sci":97,"eng":89}},{"name":"B","idNo":2,"marks":{"math":88,"sci":87,"eng":79}},{"name":"C","idNo":3,"marks":{"math":87,"sci":98,"eng":91}}]; const result = _.mergeWith({}, ...students, (objValue, srcValue) => (objValue || []).concat(srcValue)); console.log(result); 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.16.4/lodash.min.js"></script> 

在舊瀏覽器中，您可以將所有參數連接到單個數組，並使用_.spread() ：

 var students = [{"name":"A","idNo":1,"marks":{"math":98,"sci":97,"eng":89}},{"name":"B","idNo":2,"marks":{"math":88,"sci":87,"eng":79}},{"name":"C","idNo":3,"marks":{"math":87,"sci":98,"eng":91}}]; var result = _.spread(_.mergeWith)([{}].concat(students, function(objValue, srcValue){ return (objValue || []).concat(srcValue); })); console.log(result); 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.16.4/lodash.min.js"></script> 

Answer 3

您可以使用reduce()和forEach()來獲得所需的結果。

 var students = [{"name":"A","idNo":1,"marks":{"math":98,"sci":97,"eng":89}},{"name":"B","idNo":2,"marks":{"math":88,"sci":87,"eng":79}},{"name":"C","idNo":3,"marks":{"math":87,"sci":98,"eng":91}}]; var result = students.reduce(function(r, e) { Object.keys(e).forEach(function(k) { if (!r[k]) { r[k] = []; } r[k].push(e[k]) }) return r; }, {}) console.log(result) 

Answer 4

你可以用一個簡單的方法來做;

 var students = [{ name: 'A', idNo: 1, marks: { math: 98, sci: 97, eng: 89 } }, { name: 'B', idNo: 2, marks: { math: 88, sci: 87, eng: 79 } }, { name: 'C', idNo: 3, marks: { math: 87, sci: 98, eng: 91 } }], result = students.reduce((p,c) => (p.name.push(c.name), p.idNo.push(c.idNo), p.marks.push(c.marks), p), {name:[], idNo:[], marks:[]}); console.log(result); 

Answer 5

只是另一個帶有_.mergeWith lodash示例

 var students = [{ name: 'A', idNo: 1, marks: { math: 98, sci: 97, eng: 89 } }, { name: 'B', idNo: 2, marks: { math: 88, sci: 87, eng: 79 } }, { name: 'C', idNo: 3, marks: { math: 87, sci: 98, eng: 91 } }], result = {}; _.forEach(students, v => _.mergeWith(result, v, (o, s) => !_.isArray(o) ? [s] : o.concat(s))); console.log(result); 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.15.0/lodash.min.js"></script> 

Answer 6

使用.reduce （collection，[iteratee = .identity]，[accumulator]）的另一個lodash示例。

• collection (Array|Object) ：要迭代的集合。
• [iteratee=_.identity] (Function) ：每次迭代調用的函數。
• [accumulator] (*) ：初始值。

碼：

 var students = [{name: 'A', idNo: 1, marks: { math: 98, sci: 97, eng: 89}}, {name: 'B', idNo: 2, marks: { math:88, sci: 87, eng: 79}}, {name: 'C', idNo: 3, marks: { math: 87, sci: 98, eng: 91}}], obj = _.reduce(students, function(o, item) { o.name.push(item.name); o.idNo.push(item.idNo); o.marks.push(item.marks); return o; }, {name: [], idNo: [], marks: []}); console.log(obj); 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.15.0/lodash.min.js"></script>