使用lodash將對象數組映射到網格（表）？

Question

因此，假設我有一個很好的平面對象數組：

let workers = [{
    name: 'Tom',
    age: 20,
    town: 'Paris'
    gender: 'M',
    position: 'DEV'
},{
    name: 'Mike',
    age: 21,
    town: 'Paris'
    gender: 'M',
    position: 'DEV'
},{
    name: 'Jake',
    age: 20,
    town: 'London'
    gender: 'M',
    position: 'DEV'
},{
    name: 'Simona',
    age: 25,
    town: 'Rome'
    gender: 'F',
    position: 'DEV'
},{
    name: 'Manuela',
    age: 20,
    town: 'Rome'
    gender: 'F',
    position: 'DEV'
},{
    name: 'Angelo',
    age: 22,
    town: 'Milan'
    gender: 'M',
    position: 'PR'
},{
    name: 'Oliver',
    age: 30,
    town: 'Berlin'
    gender: 'M',
    position: 'PR'
}];

我想根據我想要的屬性創建一個網格（行和列）。

array2gridAll（array，rowProperty，colPropery）

let rows = array2gridAll(workers, 'position', 'town');

所以網格會像這樣

|----------------------------------------------------------------------------|--------------|
|               |    Berlin   |    London    |     Milan     |     Paris     |     Rome     |
|----------------------------------------------------------------------------|--------------|
|               |      {}     |    Jake{}    |       {}      |     Tom{}     |    Simona{}  |
|       DEV     |------------------------------------------------------------|--------------|
|               |      {}     |      {}      |       {}      |     Mike{}    |   Manuela{}  |
|----------------------------------------------------------------------------|--------------|
|       PR      |   Oliver{}  |      {}      |    Angelo{}   |       {}      |      {}      |
|-------------------------------------------------------------------------------------------|

所以實際的數組：

rows = [
    [
        {

        },{
            name: 'Jake',
            age: 20,
            town: 'London'
            gender: 'M',
            position: 'DEV'
        {

        },{
            name: 'Tom',
            age: 20,
            town: 'Paris'
            gender: 'M',
            position: 'DEV'
        },{
            name: 'Simona',
            age: 25,
            town: 'Rome'
            gender: 'F',
            position: 'DEV'
        }
    ],
    [
        {

        },{

        },{

        },{
            name: 'Mike',
            age: 21,
            town: 'Paris'
            gender: 'M',
            position: 'DEV'
        },{
            name: 'Manuela',
            age: 20,
            town: 'Rome'
            gender: 'F',
            position: 'DEV'
        },
    ],
    [
        {
            name: 'Oliver',
            age: 30,
            town: 'Berlin'
            gender: 'M',
            position: 'PR'
        },{

        },{
            name: 'Angelo',
            age: 22,
            town: 'Milan'
            gender: 'M',
            position: 'PR'
        },{

        },{

        }
    ]
];

希望這有意義嗎？

另一個功能是

array2grid（array，rowProperty，rows，colPropery，cols）

let rows = array2grid(workers, 'position', ['DEV'], 'town', ['Rome', 'Paris']);

我會去哪里

|------------------------------------------------|
|               |      Rome     |     Paris      |
|------------------------------------------------|
|               |     Simona{}  |     Tom{}      |
|       DEV     |--------------------------------|
|               |    Manuela{}  |     Mike{}     |
|------------------------------------------------|

rows = [
    [{
        name: 'Simona',
        age: 25,
        town: 'Rome'
        gender: 'F',
        position: 'DEV'
    },{
        name: 'Tom',
        age: 20,
        town: 'Paris'
        gender: 'M',
        position: 'DEV'
    }],
    [{
        name: 'Manuela',
        age: 20,
        town: 'Rome'
        gender: 'F',
        position: 'DEV'
    },{
        name: 'Mike',
        age: 21,
        town: 'Paris'
        gender: 'M',
        position: 'DEV'
    }]
];

令人尷尬的是，當我把這個問題放在一起的時候，我本來可以發展自己的：)

但是想知道最干凈的方法嗎？

Answer 1

沒有lodash。 沒有完整的表格。 但是有兩種方法可以達到結構化的結果。

1. 具有名稱的數組，作為其他數據的代理。
2. 反映水平的對象。

為什么要數組？ 它可以直接運行，但用途不是很廣泛，因為只過濾需要的行/列。

具有層次結構的對象更易於創建和過濾，以僅獲取所需的位置或城鎮。

 function getGrid(array, rowKey, colKey) { var grid = [], cols = Object.create(null), rows = Object.create(null), colLength = 0, rowLength = 0; array.forEach(function (a) { var row, col; if (!(a[rowKey] in rows)) { rows[a[rowKey]] = rowLength++; } if (!(a[colKey] in cols)) { cols[a[colKey]] = colLength++; } row = rows[a[rowKey]]; col = cols[a[colKey]]; grid[row] = grid[row] || []; if (col in grid[row]) { if (!Array.isArray(grid[row][col])) { grid[row][col] = [grid[row][col]]; } grid[row][col].push(a.name); } else { grid[row][col] = a.name; } }); return grid; } function getObject(array, rowKey, colKey) { var object = {}; array.forEach(function (a) { object[a[rowKey]] = object[a[rowKey]] || {}; object[a[rowKey]][a[colKey]] = object[a[rowKey]][a[colKey]] || []; object[a[rowKey]][a[colKey]].push(a.name); }); return object; } var workers = [{ name: 'Tom', age: 20, town: 'Paris', gender: 'M', position: 'DEV' }, { name: 'Mike', age: 21, town: 'Paris', gender: 'M', position: 'DEV' }, { name: 'Jake', age: 20, town: 'London', gender: 'M', position: 'DEV' }, { name: 'Simona', age: 25, town: 'Rome', gender: 'F', position: 'DEV' }, { name: 'Manuela', age: 20, town: 'Rome', gender: 'F', position: 'DEV' }, { name: 'Angelo', age: 22, town: 'Milan', gender: 'M', position: 'PR' }, { name: 'Oliver', age: 30, town: 'Berlin', gender: 'M', position: 'PR' }]; console.log(getGrid(workers, 'position', 'town')); console.log(getObject(workers, 'position', 'town')); 

 .as-console-wrapper { max-height: 100% !important; top: 0; }