JavaScript:仅列出一次具有相同父值的值

Question

那么直接进入正题吧。我有一个问题，我从 api 获取数据作为对象数组。每个对象包括一个城市和一个地区。城市和地区是包含名称和 ID 的对象

  city: Object
    id: 3
    name: "Rathbury"
  district: Object
    id: 39
    name: "Bosnia and Herzegovina District"

更新: 输入

[
  {
    "title": "Kris Lodge",
    "location_text": "5739 Jakob Prairie Suite 451\nWest Leraview, MI 35816",
    "latitude": "",
    "longitude": "",
    "phone_numbers": [
      "01648997890",
      "01038129111"
    ],
    "emails": [
      "christy.spinka@example.com",
      "yboyle@example.org"
    ],
    "city": {
      "id": 9,
      "name": "Bernhardburgh"
    },
    "district": {
      "id": 13,
      "name": "Hong Kong Neighbourhood"
    }
  },
  {
    "title": "Tanner Circles",
    "location_text": "4513 Patrick Junctions\nNorth Priceport, CT 05572-1565",
    "latitude": "",
    "longitude": "",
    "phone_numbers": [
      "01894655129",
      "01768939354",
      "01054035727",
      "01120801876"
    ],
    "emails": [
      "francisca56@example.org",
      "lloyd.hilpert@example.com",
      "aaliyah.rau@example.net"
    ],
    "city": {
      "id": 3,
      "name": "Rathbury"
    },
    "district": {
      "id": 11,
      "name": "Vanuatu Neighbourhood"
    }
  },
  {
    "title": "Walsh Harbors",
    "location_text": "5300 McGlynn Flat\nGustaveville, PA 08941-6431",
    "latitude": "",
    "longitude": "",
    "phone_numbers": [
      "01330125574"
    ],
    "emails": [
      "qgreenholt@example.org",
      "isawayn@example.net",
      "jtillman@example.com"
    ],
    "city": {
      "id": 15,
      "name": "Wintheiserfort"
    },
    "district": {
      "id": 34,
      "name": "Armenia Neighbourhood"
    }
  },
  {
    "title": "Botsford Villages",
    "location_text": "461 Zemlak Hollow Suite 549\nLangworthberg, NE 40867-0943",
    "latitude": "",
    "longitude": "",
    "phone_numbers": [
      "01955713451",
      "01819751112",
      "01366897031"
    ],
    "emails": [
      "stanton80@example.com"
    ],
    "city": {
      "id": 15,
      "name": "Wintheiserfort"
    },
    "district": {
      "id": 49,
      "name": "Liberia Neighbourhood"
    }
  }
]

一个城市可以出现两次，但一个区则不能。如何只列出一次城市内的地区？这是显示更多细节的图像。我怎样才能显示Mali Area和Bosnia and Herzegovina District在安帕罗维尔下一次？

Answer 1

根据您希望集合的外观，我认为此解决方案可能适合您。

var data = [{
    city: {
      id: 3,
      name: "Amaporville"
    },
    district: {
      id: 39,
      name: "Bosnia and Herzegovina District"
    }
  },
  {
    city: {
      id: 3,
      name: "Rathbury"
    },
    district: {
      id: 38,
      name: "Montenegro Heights"
    },

  },
  {
    city: {
      id: 3,
      name: "Amaporville"
    },
    district: {
      id: 40,
      name: "Mali Area"
    }
  }
]


function transformArr(orig) {
  var newArr = [],
    cities = {},
    i, cur;
  for (i = 0; i < orig.length; i++) {
    cur = orig[i];
    if (!cities[cur.city.name]) {
      var obj = {}
      obj['city'] = cur.city
      cities[cur.city.name] = {
        districts: []
      };
      obj['districts'] = cities[cur.city.name].districts
      newArr.push(obj);
    }
    cities[cur.city.name].districts.push(cur.district);
  }
  return newArr;
}

console.log(transformArr(data))

本质上，您使用 HashMap 并向其中添加城市。城市名称指向一系列地区。城市对象的目的是确定您的集合是否已包含该城市的名称。如果是这样，请将当前区域添加到该项目区域中。

在组织 HashMap 时，您还可以将 city 键添加到 obj 中，并为其分配当前对象的城市对象的值。然后，您对各地区执行相同的操作。最后，属于某个城市的所有地区都会出现在该城市下方，而不是之前出现两次(或者无论该城市在原始集合中出现多少次)。