如何获取对象的键/值对

Question

这个问题可能听起来很蠢，但我想为我的对象获取一个键/值对：

var a = {"e":1,"d":3,"f":4}

我尝试使用Object.keys(a) // 返回 ["e", "d", "f"]

但这并不能让我得到与键关联的值，我该如何同时获取它们以便在页面上显示。

HTML：

<div>
  <img src={value}/> //here i want value 1 to be displayed
{key} //with "e"
</div>

如何做到呢？谢谢！

- user1234

---

使用Object.values仅获取值，或者使用Object.entries获取键/值对。 - CRice

Object.entries(a).forEach(([key, value]) => do stuff) - Ele

感谢大家的帮助和回答，这对我非常有帮助！！！ - user1234

如果您知道键值，只需使用该键来访问对应的值... object[key] 就会返回该值。 - me_

可能是 best way to get the key of a key/value javascript object 的重复问题。 - me_

Answer 1

以下是使用纯JavaScript方法通过Object.entries()从对象中获取键/值对的方法：

var a = {"e":1,"d":3,"f":4}

for (const [key, value] of Object.entries(a)) {
  console.log(`${key} ${value}`);
}

- Vikasdeep Singh

Answer 2

如果您想获取单个值：

Just use: *a.e* or *a[e]* return 1 

eg. <img src={a.e} />

如果您想迭代一个对象以获取值，有几种方法：

var a = {"e":1,"d":3,"f":4}

方法一：使用for循环：

for ( var x in a) {
    console.log('v:',a[x]);
}

方法2：使用map：

Object.keys(a).map( (k) => {console.log('k',a[k])} );

方法三：使用foreach循环：

Object.keys(a).forEach(function(key,index) {
        console.log('a[key]',a[key]);
      });

- Thanh Lam

Answer 3

一种方法是这样的：

您可以像这样做：

var a = {"e":1,"d":3,"f":4}

 for(var key in a){
  alert(key + ' : ' + a[key])
 }

如果您需要迭代每个成对的元素。然而，在JavaScript中，for-in循环有些棘手，如果您决定采用这种方法，应该阅读一些相关内容。

https://jsfiddle.net/edh4131/hd9p7cxq/

- edh4131

Answer 4

var a = {"e":1,"d":3,"f":4}
let container = document.querySelector('.container')

Object.entries(a).forEach(entry =>{
 let div = document.createElement('div')
  let img = document.createElement('img')
  img.src = entry[1]
  div.textContent = entry[0]
  div.appendChild(img)
  
  container.appendChild(div)
})

<div class="container">
  
</div>

- Giacomo Ciampoli