需要一些关于以下 Typescript/Javascript 和 MobX 代码的工作的解释

Question

以下代码用于创建一个包含按日期排列的对象组（数组）的数组。我能理解其意图，但无法理解代码的工作原理。这是来自“Neil Cummings”的课程，不幸的是我找不到他的 SO 句柄来直接问他。我也借了课程，所以我也不能通过问答来问他。所以请考虑向我解释代码。

@computed get activitiesByDate() {
    return this.groupActivitiesByDate(Array.from(this.activityRegistry.values()));
}

groupActivitiesByDate(activites: IActivity[]){
    const sortedActivities = activites.sort(
      (a,b) => Date.parse(a.date) - Date.parse(b.date)
    )
    return Object.entries(sortedActivities.reduce((activities, activity) => { 
      const date = activity.date.split('T')[0];
      activities[date] = activities[date] ? [...activities[date], activity]: [activity];
      return activities;
    }, {} as {[key: string]: IActivity[]}));
  }

在上面的代码中，我可以理解一个新数组，即“sortedActivities”是通过对活动数组进行排序而创建的。然后再次调用 reduce 函数，其中每个 activity 的部分日期被拆分以查找具有相同日期的对象并将它们分组 - 这是 Object.entries 进来的地方。我无法理解的是当我们实际对活动数组进行排序时，“activites”数组的排序会影响“sortedActivities”，当使用三元运算符时也会影响行。我们可以直接比较两个数组吗？如果是这样，为什么要从数组中获取每个对象？我完全糊涂了，我试图搜索一些类似的代码以获得清晰明了的解释，但我找不到。任何人都可以帮助我。我希望我已经为这个问题提供了足够的信息。

Answer 1

好吧，让我们逐行分析：

const sortedActivities = activites.sort(
  (a,b) => Date.parse(a.date) - Date.parse(b.date)
)

这里我们按日期对一组活动进行排序，非常简单。这里还有一个非常新手的错误（不太确定课程作者是怎么做到的），就是 .sort 实际上改变了原始数组。所以这样调用它是很糟糕的，你需要先调用.slice()来创建新的单独副本。

sortedActivities.reduce((activities, activity) => { 
  const date = activity.date.split('T')[0];
  activities[date] = activities[date] ? [...activities[date], activity]: [activity];
  return activities;
}, {} as {[key: string]: IActivity[]})

然后我们制作按同一日期分组的活动数组的地图，所以最后会是这样的：

const reduceResult = {
  // Might be different format for date, but you see the point
  '2020-08-10': [activity, activity],
  '2020-09-10': [activity],
  '2020-10-10': [],
  // ...
}

所以这一行：

activities[date] = activities[date] ? [...activities[date], activity]: [activity];

只检查带有 date 键的数组是否已经存在，如果不存在则创建新数组，如果存在则将旧数组与当前 activity

合并

那我们returnObject.entries

Object.entries(...)

基本上只是从我们的地图中获取所有值。

但是这里还有另一个可能的错误（或错误），因为代码的作者假设从排序数组创建映射也总是排序的，但事实并非如此，Object.entries 迭代了属性一个任意顺序的对象，所以你不应该依赖它，即使它现在适用于这种情况。

需要一些关于以下 Typescript/Javascript 和 MobX 代码的工作的解释

Need some explanation regarding the working of following Typescript/Javascript and MobX code

javascript

reactjs

typescript

mobx