如何根据指定属性合并对象数组并拼接字符串值-js教程-PHP中文网

如何根据指定属性合并对象数组并拼接字符串值

本文介绍如何基于对象数组中某个属性（如 paymentid）的相同值，将对应对象的特定字段（如 label）合并为逗号分隔的字符串，最终生成结构清晰、符合业务需求的新数组。

本文介绍如何基于对象数组中某个属性（如 paymentid）的相同值，将对应对象的特定字段（如 label）合并为逗号分隔的字符串，最终生成结构清晰、符合业务需求的新数组。

在实际开发中，常需对具有相同标识（如 paymentId）的对象进行聚合处理。例如，原始数据中多个对象可能共享同一 paymentId，但需将它们的 label 字段合并为单一字符串（以英文逗号分隔），而非数组形式。以下提供一种简洁、可读性强且兼容性良好的实现方案。

✅ 推荐实现：使用 reduce() 一次性聚合（更优雅）

相比多次遍历 + find()，Array.prototype.reduce() 更高效、语义更清晰，且能直接输出目标格式（label 为字符串，非数组）：

const data = [
  { label: 'General-A-5', paymentId: 1 },
  { label: 'General-A-4', paymentId: 1 },
  { label: 'General-A-3', paymentId: 2 }
];

const merged = data.reduce((acc, curr) => {
  const existing = acc.find(item => item.paymentId === curr.paymentId);
  if (existing) {
    // 将现有 label 转为数组，追加当前 label，再 join 成字符串
    const labels = Array.isArray(existing.label) 
      ? existing.label 
      : [existing.label];
    existing.label = [...labels, curr.label].join(',');
  } else {
    // 首次出现，直接保留原始 label（字符串）
    acc.push({ ...curr });
  }
  return acc;
}, []);

console.log(merged);
// 输出：
// [
//   { label: 'General-A-5,General-A-4', paymentId: 1 },
//   { label: 'General-A-3', paymentId: 2 }
// ]

⚠️ 注意事项与最佳实践

避免副作用：原答案中直接修改 match.label 类型（从字符串转数组）虽可行，但易引发类型不一致问题；推荐统一在合并逻辑中处理字符串拼接，保持输出字段始终为 string 类型。

Zoom Workplace
Zoom Workplace是一款AI办公效率工具，Zoom推出的AI办公协作和交流沟通平台。

下载

性能考量：find() 在每次循环中线性查找，时间复杂度为 O(n²)；若数据量较大（>1000 条），建议先用 Map 或对象哈希预分组，再映射为结果数组（O(n)）：

const grouped = data.reduce((map, item) => {
  const key = item.paymentId;
  const labels = map.get(key) || [];
  map.set(key, [...labels, item.label]);
  return map;
}, new Map());

const optimizedResult = Array.from(grouped, ([paymentId, labels]) => ({
  label: labels.join(','),
  paymentId
}));