Obtenir une réponse JSON dans un tableau javascript

Question

Si j'ai la fonction suivante qui itère à travers un objet de réponse JSON (val2):

function test(val2){ 

    jQuery.each(val2.maps, function(j, val3) {  

     maps = new Array({ 

      id: val2.maps[j].id, 
      parent: val2.maps[j].parent, 
      image: val2.maps[j].image, 
      data: val2.maps[j].data, 
      width: val2.maps[j].width, 
      height: val2.maps[j].height, 
      top: val2.maps[j].top, 
      left: val2.maps[j].left       
     }) 

    }); 

return maps 
} 

comment puis-je obtenir dans un tableau qui ressemble au format suivant? Actuellement, je ne récupère que le dernier élément du tableau.

maps = [{ 
    id: 'south', 
    parent: 'us', 
    image: '/resources/images/maps/map_south.jpg', 
    data: 'popups/region_south.html', 
    width: '227px', 
    height: '177px', 
    top: '120px', 
    left: '49px' 
}, 
{ 
    id: 'east', 
    parent: 'us', 
    image: '/resources/images/maps/map_east.jpg', 
    data: 'popups/region_east.html', 
    width: '156px', 
    height: '121px', 
    top: '120px', 
    left: '283px' 
}] 

Vive

Answer 1

toujours plaisir quand les gens affichent des réponses sans expliquer quoi que ce soit il me semble que vous ne savez pas vraiment ce que vous faites ici, alors laissez-moi vous expliquer:

function test(val2){ 

    // use jQuery.each to apply a function to each element in val2.maps 
    jQuery.each(val2.maps, function(j, val3) {  

     // here you create a new global variable called 'maps' and assign and Array to it 
     // the constructor 'new Array' is given one argument here 
     // which is the object in which you map the values 
     // notice: you're always creating a new array with only ONE element 
     //   therefore you never fill it up 
     maps = new Array({ 

      // Instead of 'val2.maps[j].id', you could simply do 'val3.id' etc. 
      // Since val3 already contains 'val2.maps[j]' 
      id: val2.maps[j].id, 
      parent: val2.maps[j].parent, 
      image: val2.maps[j].image, 
      data: val2.maps[j].data, 
      width: val2.maps[j].width, 
      height: val2.maps[j].height, 
      top: val2.maps[j].top, 
      left: val2.maps[j].left       
     }) // missing semicolon here btw ;) 

    }); 

    // this returns the last Array that was created 
    return maps 
} 

est ici une version fixe, qui ne fait remplir le tableau correctement:

function test(val2){ 
    var maps = []; // create an array that's local to this function, so it does not override any global stuff 
    jQuery.each(val2.maps, function(j, val3) {  

     // append a new element to the array, this time directly use 'val3' 
     maps.push({ 
      id: val3.id, 
      parent: val3.parent, 
      image: val3.image, 
      data: val3.data, 
      width: val3.width, 
      height: val3.height, 
      top: val3.top, 
      left: val3.left       
     }); 
    }); 

    // this time return the array with all the elements 
    return maps 
} 

également tout votre code n'a pratiquement aucun effet, puisque tout ce que vous faites est de copier les éléments d'un tableau dans un autre sans changer la structure de quelque façon. Donc à la fin les valeurs dans val2.maps et vos maps retournés sont "identiques", seulement la différence est qu'ils ne pointent pas vers les mêmes objets puisque vous avez copié toutes les valeurs dans les nouvelles.

Si vous n'avez pas besoin d'une copie ou que vous souhaitez conserver la référence aux valeurs d'origine, cela ferait:

function test(val2) { 
    return val2.maps; // return the reference to maps 
} 

Nick a montré une version encore colombophile de faire toute chose de copie, mais je pensais que cela pourrait vous aider plus si quelqu'un soulignerait réellement vos erreurs, plutôt que postant même le code jQuery "plus fou" pour que vous copiez & pâte;)

PS: Aimez mon Firefox, Session juste s'est écrasé mais ma réponse était toujours là après le redémarrage^_^"

Answer 2

Quelque chose comme cela devrait faire:

var result = []; 
jQuery.each(val2.maps, function(j, val3) {  
    maps = result.push({ 
     id: val2.maps[j].id, 
     ... 
    }); 
}); 

Answer 3

Vous pouvez utiliser jQuery.map(), comme ceci:

function test(val2){ 
    return jQuery.map(val2.maps, function() {  
    return { 
      id: this.id, 
      parent: this.parent, 
      image: this.image, 
      data: this.data, 
      width: this.width, 
      height: this.height, 
      top: this.top, 
      left: this.left       
      }; 
    }).get(); 
} 

Bien que, étant donné le format, il semble que val2.maps est déjà la collecte Vous êtes après, ne pouvez-vous pas l'utiliser directement?