javascript - 使用数组值查找父对象的键值

Question

使用 Google map API，我希望能够通过同一对象内数组内的值查找对象内键的值。当我在页面上“检查元素”以查看控制台时，以下是它以对象结构显示的内容:

results: {
    address_components [
        0: Object: {
            long_name: "704",
            short_name: "704",
            types [
                0:"street_number"
            ]
        }
        1: Object {...}
        2: Object {...}
        3: Object {...}
    ]
    place_id:"8AS8D8F8A881C81DA6S6D8"
}

我希望能够在对象中找到“street_number”，这样我就可以找到也驻留在该对象中的“704”的相应值。

棘手的部分是“address_compenents”中的值并不总是按相同的顺序排列，因此我不能只在 JavaScript 中编写 results[0].address_components[0].long_name 来查找它。我在这个项目中仅限于 javascript，因此任何使用该语言的答案将不胜感激。预先感谢您!

注意:如果有助于解决问题，我并不反对使用像 lodash 或 underscore 这样的库。

Answer 1

首先find()该项目，然后读取所需的属性。

请注意，您还应该考虑并处理响应中没有 street_number 的情况，此代码段未涵盖这种情况。

var results = {
  address_components: [{
    long_name: "704",
    short_name: "704",
    types: [
      "street_number"
    ]
  }, {
    long_name: "100",
    short_name: "100",
    types: [
      "attribute_a"
    ]
  }, {
    long_name: "200",
    short_name: "200",
    types: [
      "attribute_b"
    ]
  }, {
    long_name: "300",
    short_name: "300",
    types: [
      "attribute_c"
    ]
  }],
  place_id: "8AS8D8F8A881C81DA6S6D8"
}

var streetNumber = results.address_components.find(function(item) {
  return item.types.some(function(subitem) {
    return subitem === 'street_number'
  });
}).long_name;

console.log(streetNumber); // 704