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": [      "[e-mail]",      "[e-mail]"    ],    "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": [      "[e-mail]",      "[e-mail]",      "[e-mail]"    ],    "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": [      "[e-mail]",      "[e-mail]",      "[e-mail]"    ],    "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"    ],一个城市可以出现两次，但一个地区不能出现。如何只列出城市内的地区一次？这是显示更多详细信息的图像。我怎样才能得到展示Mali Area和Bosnia and Herzegovina District下Amparoville一次？

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))

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

当您组织散列映射时，您还向其添加city键obj并为其分配当前对象的城市对象的值。然后你对地区做同样的事情。最后，属于一个城市的所有地区都会出现在该城市下方，而不是之前出现两次（或者该城市在原始收藏中出现过多少次）。