解释复杂的减少用例

Question

我有以下数组：

[0:{
boat: "Laura"
date: "2022-05-14"
doy: 133
end: "22:00:00"
fname: "David"
lname: "Cross"
skipperid: 217
spots: 5
start: "09:00:00"
type: "RES"},
1:{
boat: "Avrora"
date: "2022-05-14"
doy: 133
end: "13:00:00"
fname: "Bob"
lname: "Smith"
skipperid: 1
spots: 3
start: "10:00:00"
type: "SAIL"}]

我应用以下方法将它变成一个数组对象，其中每个对象的键是 skipperid。

daySails = daySails.reduce((b, a) => ({        
           ...b,
           [a.skipperid]: a
           }), {});

有人可以解释一下这是如何工作的吗？

Answer 1

我会用不同的方式来写，以避免在每次迭代时创建一个新对象，同时也让它不那么“复杂”：

daySails = daySails.reduce((b, a) => {
  b[a.skipperid] = a;
  return b;
}, {});

每次迭代都会将一个新元素添加到结果对象中，并将“skipperid”作为其键。在每次调用 => 回调函数时，b 是正在构建的对象 step-by-step（在 .reduce() 调用中使用 {} 初始化），并且 a是源数组的一个元素（原来的daySails）。因此每个源元素都通过 skipperid.

添加到 built-up 结果元素

请注意，如果原件中的两个条目具有相同的 skipperid，您最终只会得到一个。如果这是您遇到的问题，通常的处理方法是将条目变成 arrays 而不是单个对象：

daySails = daySails.reduce((b, a) => {
  // Check if the "skipperid" is present already
  if (!b[a.skipperid])
    b[a.skipperid] = []; // nope, so create new array 
  b[a.skipperid].push(a); // add element
  return b;
}, {});

解释复杂的减少用例

explain complicated reduce use case

javascript

reduce