使用Array.reduce

Question

谢谢你的期待。所以基本上我有一个对象数组。哪个正在更新。因此，动态添加了更多任务。

let tasks = [
    {title: "Create smth", assignee: 'John'},
    {title: "Create smth else", assignee: 'John'},
    {title: "do smth", assignee: 'Adam'},
    {title: "Create more smth", assignee: 'Ann'},
    {title: "Create smth", assignee: 'John'},
    {title: "Create more smth", assignee: 'Ann'}
 ]

我想要的是从中创建一些动态更新的统计信息。像这样的东西。
Assingnee - 完成任务
亚当1 安2 约翰3 ...... ... 如何迭代数组并提取所需的信息???

Answer 1

让我们以正确的方式做到这一点：

let tasks = [{title: "Create smth", assignee: 'John'}, {title: "Create smth else", assignee: 'John'}, {title: "do smth", assignee: 'Adam'}, {title: "Create more smth", assignee: 'Ann'}, {title: "Create smth", assignee: 'John'}, {title: "Create more smth", assignee: 'Ann'}];

let result = {};

tasks.forEach(t => {                              // For each entry in your array, 
    result[t.assignee] = result[t.assignee] || 0; // Set a default value, we haven't seen this assignee yet.
    result[t.assignee]++;                         // Increment for assignee
});

console.log(result);

Answer 2

为了获得所需的结果，我首先创建一个地图，以总结每个受让人的任务数量。接下来，我将地图转换回数组，其中每个项目都是具有受理人姓名和分配任务数量的对象。完成此操作后，结果是一个数组，可以在受理人或分配的任务数上进行排序。

const 
  tasks = [
      {title: "Create smth", assignee: 'John'},
      {title: "Create smth else", assignee: 'John'},
      {title: "do smth", assignee: 'Adam'},
      {title: "Create more smth", assignee: 'Ann'},
      {title: "Create smth", assignee: 'John'},
      {title: "Create more smth", assignee: 'Ann'},
      {title: "Additional task", assignee: "Becky"}
  ];
  
  
function transformData(inputArray) {
  const
   tasksMap = new Map();
   
  // Iterate over all tasks...
  inputArray.forEach(task => {
    // Check if the map has a value for the current name.
    if (!tasksMap.has(task.assignee)) {
      // The key doesn't exist yet, create it by assigning 1 to it.
      tasksMap.set(task.assignee, 1);
    } else {
      // The name is already in the map, increase the task count by 1.
      tasksMap.set(task.assignee, tasksMap.get(task.assignee) + 1);
    }
  });
  
  const
    tasksArray = [];
  
  // Iterate over all the items in the map and convert each entry to an 
  // object and place it in the array.
  tasksMap.forEach((value, key) => tasksArray.push({
    assignee: key,
    tasks: value
  }));
  
  return tasksArray;
}
 
  
  
  
/* === SORT METHODS === */
function sortByName(a, b) {
  if (a.assignee < b.assignee) {
    return -1;
  } else if (a.assignee > b.assignee) {
    return 1;
  }
  
  return 0;
}

function sortByTasks(a, b) {
  return a.tasks - b.tasks;
}



/* === UI METHODS === */
function arrayToUI(sourceArray, element) {
  element.innerHTML = `<table>
  <thead><tr><th>Assignee</th><th>Tasks</th></tr></thead> 
  <tbody>
    ${sourceArray.reduce((html, item) => { 
      html += `<tr><td>${item.assignee}</td><td>${item.tasks}</td></tr>`;
      return html;
    }, '')}
  </tbody>
  </table>`;
}

const
  tasksArray = transformData(tasks);
  
arrayToUI(tasksArray, document.getElementById('output-original'));

tasksArray.sort(sortByName);
arrayToUI(tasksArray, document.getElementById('output-assignee'));

tasksArray.sort(sortByTasks);
arrayToUI(tasksArray, document.getElementById('output-tasks'));

<p>Output after summing up tasks:</p>
<div id="output-original"></div>

<p>Output after sorting by assignee:</p>
<div id="output-assignee"></div>

<p>Output after sorting by tasks:</p>
<div id="output-tasks"></div>

Answer 3

使用Array.reduce

资源：

https://www.w3schools.com/jsref/jsref_reduce.asp

实施例

这可以写得更短但是更易读。

let tasks = [
    {title: "Create smth", assignee: 'John'},
    {title: "Create smth else", assignee: 'John'},
    {title: "do smth", assignee: 'Adam'},
    {title: "Create more smth", assignee: 'Ann'},
    {title: "Create smth", assignee: 'John'},
    {title: "Create more smth", assignee: 'Ann'}
 ]

var result = tasks.reduce(function(total, task){  

 var obj = total;
 if(total.title)
 {
     obj = {};
	 obj[total.assignee] = 1;
 }

if(!obj[task.assignee]){
    obj[task.assignee] = 1;  
}
else
{
    obj[task.assignee] = obj[task.assignee] + 1;
}
return obj;
});

console.log(result);

从对象数组

3 个答案:

使用Array.reduce

资源：

实施例