AngularJS中如何在Map阶段将nmAssunto与dtResposta存入同一数组？

问题背景 #

你当前的代码是遍历listDeColaboradoresObject数组，为每个用户分别生成listNmAssunto和listDtResposta两个独立数组。现在需要调整逻辑，把每个用户对应的nmAssunto和dtResposta配对存入同一个数组中，而不是分开存储。

原代码如下：

$scope.listDeColaboradoresObject.forEach(item => { 
  item.listNmAssunto = $scope.relatorioTotalMensagensRespondidasColab 
    .filter(x => x.nmUsuario == item.nmUsuario) 
    .map(x => x.nmAssunto); 
  item.listNmAssunto = $scope.removeDuplicates(item.listNmAssunto); 
  item.listDtResposta = $scope.relatorioTotalMensagensRespondidasColab 
    .filter(x => x.nmUsuario == item.nmUsuario) 
    .map(x => x.dtResposta); 
});

输入数组示例：

[
  {deTipoAtendimento: "012", nmAssunto: "Cartão extraviado", nmUsuario: "15", dtResposta: "2018", total: 1},
  {deTipoAtendimento: "012", nmAssunto: "Assunto Novo 012", nmUsuario: "Admin", dtResposta: "2018", total: 2},
  {deTipoAtendimento: "012", nmAssunto: "Assunto Novo 012", nmUsuario: "Administrador", dtResposta: "2018", total: 1},
  {deTipoAtendimento: "012", nmAssunto: "Assunto Novo 012", nmUsuario: "Administrador IMB", dtResposta: "2018", total: 3},
  {deTipoAtendimento: "012", nmAssunto: "Assunto Teste GREAt", nmUsuario: "Administrador IMB", dtResposta: "2018", total: 2},
  {deTipoAtendimento: "012", nmAssunto: "Thais 23042018", nmUsuario: "Administrador IMB", dtResposta: "2018", total: 2},
  {deTipoAtendimento: "012", nmAssunto: "teste Alterado2", nmUsuario: "Administrador IMB", dtResposta: "2018", total: 1}
]

原输出（两个独立数组）：

[
  {nmUsuario: "15", listNmAssunto: ["Cartão extraviado"], listDtResposta: ["2018"], $$hashKey: "object:2975"},
  {nmUsuario: "Admin", listNmAssunto: ["Assunto Novo 012"], listDtResposta: ["2018"], $$hashKey: "object:2976"},
  {nmUsuario: "Administrador", listNmAssunto: ["Assunto Novo 012"], listDtResposta: ["2018"], $$hashKey: "object:2977"},
  {nmUsuario: "Administrador IMB", listNmAssunto: ["Assunto Novo 012", "Assunto Teste GREAt", "Thais 23042018", "teste Alterado2"], listDtResposta: ["2018", "2018", "2018", "2018"], $$hashKey: "object:2978"}
]

修改后的代码 #

下面是调整后的代码，我们会把配对的nmAssunto和dtResposta存入同一个对象数组，同时优化重复的filter操作（原来的代码重复过滤了两次，现在只需要一次）：

$scope.listDeColaboradoresObject.forEach(item => { 
  // 先过滤出当前用户的所有记录，只做一次过滤提升性能
  const userRecords = $scope.relatorioTotalMensagensRespondidasColab.filter(x => x.nmUsuario === item.nmUsuario);
  
  // Map生成包含nmAssunto和dtResposta的对象数组
  item.listAssuntoResposta = userRecords.map(x => ({
    nmAssunto: x.nmAssunto,
    dtResposta: x.dtResposta
  }));
  
  // 如果需要对组合后的对象去重（比如同一个nmAssunto+dtResposta只保留一次），更新去重函数
  item.listAssuntoResposta = $scope.removeDuplicateObjects(item.listAssuntoResposta);
});

// 新增/修改去重函数，针对对象数组（根据nmAssunto和dtResposta的组合判断重复）
$scope.removeDuplicateObjects = (arr) => {
  const seen = new Set();
  return arr.filter(obj => {
    const key = `${obj.nmAssunto}-${obj.dtResposta}`;
    if (!seen.has(key)) {
      seen.add(key);
      return true;
    }
    return false;
  });
};

代码说明 #

1. 减少重复过滤：原来的代码对同一个用户做了两次filter操作，现在先把当前用户的所有记录一次性过滤出来，提升代码性能。
2. 合并字段到同一数组：在map时返回包含nmAssunto和dtResposta的对象，这样每个数组元素就是一对关联的数据。
3. 对象数组去重：因为原来的removeDuplicates是针对字符串数组的，现在要处理对象数组，所以新增了removeDuplicateObjects函数，通过组合nmAssunto和dtResposta作为唯一键来去重。如果你的场景不需要去重，可以去掉这一步。

修改后的输出示例 #

调整后每个用户的输出会变成这样：

[
  {nmUsuario: "15", listAssuntoResposta: [{nmAssunto: "Cartão extraviado", dtResposta: "2018"}], $$hashKey: "object:2975"},
  {nmUsuario: "Admin", listAssuntoResposta: [{nmAssunto: "Assunto Novo 012", dtResposta: "2018"}], $$hashKey: "object:2976"},
  {nmUsuario: "Administrador", listAssuntoResposta: [{nmAssunto: "Assunto Novo 012", dtResposta: "2018"}], $$hashKey: "object:2977"},
  {nmUsuario: "Administrador IMB", listAssuntoResposta: [
    {nmAssunto: "Assunto Novo 012", dtResposta: "2018"},
    {nmAssunto: "Assunto Teste GREAt", dtResposta: "2018"},
    {nmAssunto: "Thais 23042018", dtResposta: "2018"},
    {nmAssunto: "teste Alterado2", dtResposta: "2018"}
  ], $$hashKey: "object:2978"}
]

内容的提问来源于stack exchange，提问作者Raphael Melo De Lima