如何在javascript中从对象值返回键？

我在React中映射了一个对象，并希望它能够进行交互：我希望这样，当用户单击某个元素旁边的“X”按钮时，它将console.log该单击元素的键

以下是对象：

var obj = {
  person1: {
    name: 'iggy',
    superPower: 'awesomeness',
    favDonut: 'chocolate'
  },
  person2: {
    name: 'iggy2',
    superPower: 'stupendousness',
    favDonut: 'glazed'
  },
  person3: {
    name: 'iggy3',
    superPower: 'amazingness',
    favDonut: 'chocolate sprinkles'
  }
};

迭代如下所示：

X chocolate
X glazed
X chocolate sprinkles

如果我在

glalled

上单击x，我希望它是console.log

person2

，因为那是

glalled

的父对象。如果我在巧克力洒上单击x，我希望它是console.log

person3

这是小提琴：

---

我试图找出的方法是

getPersonName

函数。允许用户单击x和console.log相关对象键的最佳方式是什么？

您需要将

onClick

设置为使用相应的person对象调用

getPersonName

的内联函数

  getPersonName: function(person){
    console.log(person);
  },

  render(){
    const donutValues = Object.values(obj).map((person, index) => <li key={index}><a href="#" onClick={function(){this.getPersonName(person)}.bind(this)}>X</a> {person.favDonut} </li>);
    return (
      <div>
        Hello 
          <ul>
            {donutValues}
          </ul>
          Give me person: {this.state.person}
      </div>
    );
  }

getPersonName:函数（个人）{
控制台日志（个人）；
},
render（）{
const donutValues=Object.values（obj.map）（（person，index）=>
{person.favDonut}
）；
返回(
你好

{donutValues}

给我个人：{this.state.person}
);
}

---

在这里找到更新的JSFIDLE:

而不是执行

对象。值

您将要执行

对象。键

，这样您就可以访问相应的键

  getPersonName: function(person){
    console.log(person);
  }

const donutValues = Object.keys(obj).map((key, index) => <li key={index}><a href="#" onClick={() => this.getPersonName(key)}>X</a> {obj[key].favDonut} </li>);

getPersonName:函数（个人）{
控制台日志（个人）；
}
const donutValues=Object.keys（obj）.map（（key，index）=>
{obj[key].favDonut}
）；

更新的小提琴：

对象。键（obj）同时显示对象[key].favDonut

。我没想到。谢谢