如何使用.map()获取对象数组中的键？

Question

所以，我这里有一个像这样的数组

[{"facebook":"https://facebook.com"}, {"instagram":"https://instagram.com"}]

现在我想将键显示为图标名称，将值显示为 href 链接。

socials.map((social, index) => { 
    return(
        <View key={index}>
             <Icon name={social.facebook} onPress={() => {}} />
        </View>
    ); 
})

如何在不选择特定键名的情况下将键分配给图标名称？ 谢谢。

- K. Pradnyana

Answer 1

使用Object.keys()方法 -

let data = [{"facebook":"https://facebook.com"}, {"instagram":"https://instagram.com"}]

data.forEach(social => console.log(Object.keys(social)[0]));

这里我使用.forEach()而不是.map()只是为了记录键名，但与.map()的想法相同。

- Manish Giri

---

[{"facebook":"https://facebook.com"}, {"instagram":"https://instagram.com"}].map(Object.keys).map(String) - dandavis

Answer 2

如果socials是您的初始数据数组，则我会执行以下操作：

socials.map((social, index) =>
    (
        <View key={index}>
             <Icon name={Object.keys(social)[0]} onPress={() => {}} />
        </View>
    )
)

- dhilt

---

谢谢！它有效。 - K. Pradnyana

Answer 3

你可以在map方法中使用Object.keys。Object.keys返回一个数组，包含自身的所有属性。因此，Object.keys(item)[0]将返回每个对象的键。

var social = [{
  "facebook": "https://facebook.com"
}, {
  "instagram": "https://instagram.com"
}]
var x = social.map(function(item) {
  return Object.keys(item)[0]
})
console.log(x)

- brk