簡體   English   中英

Javascript Map 減少對象的 Arrays 中的多個字段

[英]Javascript Map Reduce Multiple Fields in Arrays of Objects

我正在嘗試總結多個 arrays 對象(鍵值對)。 我發現另一篇使用 map 減少 function 的帖子,但我不確定如何將其翻譯為通過多個鍵返回。 當前的解決方案顯示按月減少和映射,但我需要按月和銷售人員減少和 map。 我的 HTML 索引中有 d3 下拉菜單,其中包含月份和銷售人員,其中包括兩個類別中的所有選項。

When a single salesperson and all months are selected the data_array looks like this:

data_array =  [{salesperson: 'Beth', month: 'Feb', 'value ly': 8, 'value plan': 10, 'value ty' : 14},
    {salesperson: 'Beth', month: 'Jan', 'value ly': 16, 'value plan': 18, 'value ty' : 20},
    {salesperson: 'Beth', month: 'Feb', 'value ly': 12, 'value plan': 15, 'value ty' : 18},
    { salesperson: 'Beth', month: 'Jan', 'value ly': 13, 'value plan': 21, 'value ty' : 25}]

When all salespersons and all months are selected the data_array looks like this:

data_array = [{salesperson: 'Joe', month: 'Jan', 'value ly': 10, 'value plan': 20, 'value ty' : 30},
{salesperson: 'Joe', month: 'Jan', 'value ly': 14, 'value plan': 18, 'value ty' : 22},  
{salesperson: 'Greg', month: 'Feb', 'value ly': 5, 'value plan': 10, 'value ty' : 12},
{ salesperson: 'Greg', month: 'Feb', 'value ly': 7, 'value plan': 9, 'value ty' : 5},
{salesperson: 'Joe', month: 'Feb', 'value ly': 12, 'value plan': 14, 'value ty' : 16},
{ salesperson: 'Joe', month: 'Feb', 'value ly': 15, 'value plan': 16, 'value ty' : 13},
{salesperson: 'Beth', month: 'Feb', 'value ly': 8, 'value plan': 10, 'value ty' : 14},
{salesperson: 'Beth', month: 'Jan', 'value ly': 16, 'value plan': 18, 'value ty' : 20},
{salesperson: 'Beth', month: 'Feb', 'value ly': 12, 'value plan': 15, 'value ty' : 18},
{ salesperson: 'Beth', month: 'Jan', 'value ly': 13, 'value plan': 21, 'value ty' : 25}]

使用 data_array 的第一個結果,我的代碼運行如下:

 data_array =  [{salesperson: 'Beth', month: 'Feb', 'value ly': 8, 'value plan': 10, 'value ty' : 14},
        {salesperson: 'Beth', month: 'Jan', 'value ly': 16, 'value plan': 18, 'value ty' : 20},
        {salesperson: 'Beth', month: 'Feb', 'value ly': 12, 'value plan': 15, 'value ty' : 18},
        { salesperson: 'Beth', month: 'Jan', 'value ly': 13, 'value plan': 21, 'value ty' : 25}]
        
    let reduced_data_array = data_array.reduce((prev,next)=>{
       if (next.month in prev) {
             prev[next.month]['value ly'] += next['value ly'];
             prev[next.month]['value plan'] += next['value plan'];
             prev[next.month]['value ty'] += next['value ty'];
       } else {
             prev[next.month] = next;
       return prev;
    }, {});
        
let mapped_reduced_data = Object.keys(reduced_data_array).map(month => reduced_data_array[month]);

return mapped_reduced_data

選擇單個銷售員時,所有月份都以這種格式返回數據(例如:貝絲和所有月份):

在此處輸入圖像描述

我想更改我的 map 並在選擇所有銷售人員和所有月份(第二個數據集)時減少函數以返回以下內容:

在此處輸入圖像描述

TL;博士

您不需要mapreduce 只需一個簡單的filter就可以完全滿足您的需求。

data_array.filter(
  obj => LIST_OF_SALESPERSON.includes(obj.salesperson)) && LIST_OF_MONTHS.includes(obj.month)
);

為了測試這種行為,我使用您提供的數據創建了一個簡單的示例。 只需點擊“運行代碼片段”:

 // Data const data_array = [{salesperson: 'Joe', month: 'Jan', 'value ly': 10, 'value plan': 20, 'value ty': 30}, {salesperson: 'Joe', month: 'Jan', 'value ly': 14, 'value plan': 18, 'value ty': 22}, {salesperson: 'Greg', month: 'Feb', 'value ly': 5, 'value plan': 10, 'value ty': 12}, { salesperson: 'Greg', month: 'Feb', 'value ly': 7, 'value plan': 9, 'value ty': 5}, {salesperson: 'Joe', month: 'Feb', 'value ly': 12, 'value plan': 14, 'value ty': 16}, { salesperson: 'Joe', month: 'Feb', 'value ly': 15, 'value plan': 16, 'value ty': 13}, {salesperson: 'Beth', month: 'Feb', 'value ly': 8, 'value plan': 10, 'value ty': 14}, {salesperson: 'Beth', month: 'Jan', 'value ly': 16, 'value plan': 18, 'value ty': 20}, {salesperson: 'Beth', month: 'Feb', 'value ly': 12, 'value plan': 15, 'value ty': 18}, { salesperson: 'Beth', month: 'Jan', 'value ly': 13, 'value plan': 21, 'value ty': 25}]; // Function containing the logic behind the filter function getDataByFilter (filters) { return data_array.filter( obj => (filters.salesperson.length == 0 || filters.salesperson.includes(obj.salesperson)) && (filters.month.length == 0 || filters.month.includes(obj.month)) ); } // Get all data here by passing to the function the desired filters var data_no_filter = getDataByFilter({ "salesperson": [], "month": [] }); var data_by_salesperson = getDataByFilter({ "salesperson": ["Greg", "Beth"], "month": [] }); var data_by_salesperson_and_month = getDataByFilter({ "salesperson": ["Greg", "Beth"], "month": ["Feb"] }); // Print to console the data we have previously filtered console.log("No filters: %o", data_no_filter); console.log("By SalesPerson: %o", data_by_salesperson); console.log("By SalesPerson and Month: %o", data_by_salesperson_and_month);

如何實施?

只需像示例中的那樣傳遞給getDataByFilter function 和Object ,您將在其中添加從 select 獲得的數據,然后您將收到過濾后的數據

在我發布此內容后搜索了幾天后,我實際上找到了一個有效的答案:

    const reduce_data = data_array.reduce((result, d) => {
        let key = `${d.RSM}_${d.Month}`;
        result[key] = result[key] || {...d, 'value ly':0, 'value plan':0, 'value ty':0};
        result[key]['value ly'] += +d['value ly'];
        result[key]['value plan'] += +d['value plan'];
        result[key]['value ty'] += +d['value ty'];

        return result
    }, {});
    const data_result = Object.values(reduce_data);

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM