ES6 减少到新对象

Question

我有一个包含一年中所有日子的数组，如下所示：

const days = ["2019-01-01", "2019-01-02", "2019-01-03" ...]

我有一个对象保存特定日期的计划和已完成任务：

const tasks = {"2019-01-01": {"planned": 3, "completed": 2,}, "2019-01-03": { "planned": 1, "completed": 0 }, "2019-01-10": { "planned": 1, "completed": 1} ... }

我想要的是一个新对象，它包含所有天的信息，无论任务是否已计划和完成，如下所示：

const tasksNew = {"2019-01-01": {"planned": 3, "completed": 2}, "2019-02-02": {"planned": 0, "completed": 0} ...}

我知道这在某种程度上可以与 reduce 一起使用，但我现在无能为力。

Answer 1

const taskNew = days.reduce((acc, day) => {
  if (!tasks[day]) {
    return {
      ...acc,
      [day]: {
        planned: 0,
        completed: 0
      }
    }
  }  
  return {
    ...acc,
    [day]: tasks[day]
  } 
}, {});

有关减少的详细信息：https://developer.mozilla.org/fr/docs/Web/JavaScript/Reference/Objets_globaux/Array/reduce

Answer 2

您可以使用 reduce 从本质上将 days 数组映射到 tasks 对象中的键。这里我每天在days中循环，检查是否在tasks对象中。如果是，我将当前 day 作为键及其关联对象从 tasks 添加到 newTasks 对象。如果 day 不在对象中，那么我将默认值 complete: 0 和 planned: 0 添加到附加数组中：

const days = ["2019-01-01", "2019-01-02", "2019-01-03"],
tasks = {
  "2019-01-01": {
    "planned": 3,
    "completed": 2,
  },
  "2019-01-03": {
    "planned": 1,
    "completed": 0
  },
  "2019-01-10": {
    "planned": 1,
    "completed": 1
  }
},

newTasks = days.reduce((acc, day) => 
                   day in tasks ? 
                   {...acc, [day]: tasks[day]} : 
                   {...acc, [day]: {planned: 0, complete: 0}
                 }, {});

console.log(newTasks);

Answer 3

您可以减少创建新对象的天数数组。对于每一天，您将检查当天是否有任务并将它们合并到您的结果图中，如果当天没有任务，则合并一个默认的空 "indicator":

const days = [
  "2019-01-01", 
  "2019-01-02", 
  "2019-01-03", 
  "2019-01-04",
  "2019-01-07",
  "2019-01-08",
  "2019-01-09",
  "2019-01-10"
]

const DEFAULT = { "planned": 0, "completed": 0 } 

const tasks = {
  "2019-01-01": {"planned": 3, "completed": 2,}, 
  "2019-01-03": { "planned": 1, "completed": 0 }, 
  "2019-01-10": { "planned": 1, "completed": 1 }
}

const result = days.reduce(
  (map, day) =>
    Object.assign({}, map, { [day]: tasks[day] ? tasks[day] : DEFAULT }),
  {}
)

console.log(result)

Answer 4

在 days 数组上使用 reduce。对于每一天，如果在您的 tasks 对象中找到一个条目，则将此条目添加到累加器，否则，return 一个默认条目。

这里是 MDN doc on Array.reduce().

const days = ["2019-01-01", "2019-01-02", "2019-01-03"];
const tasks = {"2019-01-01": {"planned": 3, "completed": 2,}, "2019-01-03": { "planned": 1, "completed": 0 }, "2019-01-10": { "planned": 1, "completed": 1} };

const tasksNew = days.reduce((accum, day) => {
  accum[day] = tasks[day] ? tasks[day] : { planned: 0, completed: 0 };
  return accum;
}, {});

console.log(tasksNew);

Answer 5

克隆 tasks。将 tasks 中的 keys 存储在变量中。然后遍历 days 检查 keys 是否没有 includes() day 添加对象 newTasks

const days = ["2019-01-01", "2019-01-02", "2019-01-03"]

const tasks = {"2019-01-01": {"planned": 3, "completed": 2,}, "2019-01-03": { "planned": 1, "completed": 0 }, "2019-01-10": { "planned": 1, "completed": 1}}

const newTasks = JSON.parse(JSON.stringify(tasks));

const keys = Object.keys(tasks);
days.forEach(day => {
  if(!keys.includes(day))
   newTasks[day] = {completed:0,planned:0} 
   }
)
console.log(newTasks)

Answer 6

最短路线：

{...days.reduce((obj,d)=>({...obj,[d]:{ planned: 0, completed: 0 }}),{}), ...tasks}

ES6 减少到新对象

ES6 reduce to new object

javascript

ecmascript-6

reactjs