如何按指定键值排序JSON数组并处理空值与重复post_id？

步骤分解 #

1. 过滤无效元素 #

先移除distance为null的项，用filter方法筛选有效元素：

.filter(item => item.distance !== null)

2. 按距离数值排序 #

由于distance是字符串类型，需先转为浮点数再比较，实现从小到大排序：

.sort((a, b) => parseFloat(a.distance) - parseFloat(b.distance))

3. 处理重复post_id #

如果排序后出现重复的post_id，我们保留距离最小的项（即排序后最先出现的项），两种常用实现方式：

• 方法一：用Map去重（效率更高）

  [...new Map(sortedItems.map(item => [item.post_id, item])).values()]
  

  Map的键具有唯一性，重复post_id的后续项不会覆盖已存在的键，自然保留距离最小的项。

• 方法二：用reduce遍历去重（逻辑更直观）

  .reduce((acc, curr) => {
    // 检查累加器中是否已有当前post_id的项
    if (!acc.some(item => item.post_id === curr.post_id)) {
      acc.push(curr);
    }
    return acc;
  }, [])
  

4. 生成结果字符串 #

提取所有项的post_id，拼接成逗号分隔的字符串：

.map(item => item.post_id).join(',')

完整代码示例 #

const jsonData = [{"post_id": 3,"distance": "2.130122"}, {"post_id": 3,"distance": null}, {"post_id": 4,"distance": "4.130122"}, {"post_id": 5,"distance": "3.130122"}];

const result = jsonData
  .filter(item => item.distance !== null)
  .sort((a, b) => parseFloat(a.distance) - parseFloat(b.distance))
  .reduce((acc, curr) => {
    if (!acc.some(item => item.post_id === curr.post_id)) {
      acc.push(curr);
    }
    return acc;
  }, [])
  .map(item => item.post_id)
  .join(',');

console.log(result); // 输出：3,5,4

内容的提问来源于stack exchange，提问作者Lemon Kazi