时间戳

首页 > 解决方案 > 在对象数组中获取单个键和单个值的更简单方法？

javascript - 在对象数组中获取单个键和单个值的更简单方法？

问题描述

有没有更自然的方式在 JavaScript 中获取对象的键和值？

我正在尝试在我的 React App 中填充对象数组。

数据看起来像：

Methods:[{"foo": "walk"}, {"bar":"run"}],

  getMethodList(){
    return this.state.Methods.map((item, index) => (
      <div key={index}>
        <input type="radio"
            name="Method"
            value={item.key}  <---Get the key of object
            onChange={this.handleMethodSelect}
        />
        {item.value} <---Get the value of the object
      </div>
    ))
  }

Object.keys()并Objects.value()返回键和值的列表。这不是我想要的。

是否有一种简单的方法可以以与其他编程语言（Python、Java）类似的方式获取对象的键和值？如果不是，解决我的问题的最佳“Javascript”方法是什么？

标签： javascriptreactjs

解决方案

正如@ashish-singh 建议的那样，您应该使用Object.entries

Methods:[{"foo": "walk"}, {"bar":"run"}],

getMethodList(){
  return this.state.Methods.map((item, index) => (
    <div key={index}>
      <input type="radio"
        name="Method"
        value={Object.entries(item)[0][0]} 
        onChange={this.handleMethodSelect}
     />
     {Object.entries(item)[0][1]} 
    </div>
  ))
}

让我说这是使用对象的一种不寻常的方式，不知道键并将键用作值。可能你应该使用这样的东西：

Methods:[{ key: "foo", value: "walk"}, { key: "bar", value:"run"}],

getMethodList(){
  return this.state.Methods.map((item, index) => (
    <div key={index}>
      <input type="radio"
        name="Method"
        value={item.key} 
        onChange={this.handleMethodSelect}
     />
     {item.value} 
    </div>
  ))
}

推荐阅读