Comment obtenir une paire clé/valeur pour un objet ?

Question

Cette question peut sembler très stupide, mais je veux obtenir une paire clé/valeur pour mon objet :

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

J'ai essayé avec Object.keys(a) // returns ["e", "d", "f"]

cela ne me donne pas les valeurs associées aux clés, comment puis-je obtenir les deux pour pouvoir les afficher dans une page.

html :

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

comment faire ? Merci !

Answer 1

Voilà. Pour obtenir key/value pair à partir d'un objet, faites-le comme ci-dessous en utilisant une méthode purement JavaScript Objet.entries() :

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

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

Answer 2

Si vous voulez obtenir une seule valeur :

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

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

Si vous voulez itérer un objet pour obtenir une valeur, il existe plusieurs façons :

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

Méthode 1 : Utilisé pour :

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

Méthode 2 : Utilisation de la carte :

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

Méthode 3 : Utilisation de foreach :

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

Answer 3

Vous pouvez le faire de la manière suivante :

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

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

Si vous avez besoin d'itérer sur chaque paire, c'est possible. Cependant, les boucles for in sont un peu bizarres en javascript et vous devriez lire un peu sur cette voie si vous décidez de le faire.

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

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>