Comment pousser à la fois la clé et la valeur dans un tableau dans Jquery


88

Je lis le flux RSS et pousse à la fois le titre et le lien dans un tableau dans Jquery .

Ce que j'ai fait c'est

var arr = [];

            $.getJSON("displayjson.php",function(data){
                $.each(data.news, function(i,news){
                    var title = news.title;
                    var link = news.link;
                    arr.push({title : link});
                });                      
            });

Et je lis à nouveau ce tableau en utilisant

$('#show').click(function(){
                $.each(arr, function(index, value){
                    alert( index +' : '+value);
                });
            });

Mais cela me donne une sortie comme

1:[Object Object]
2:[Object Object]
3:[Object Object]

comme ça ...

Comment puis-je obtenir à la fois la vignette et le lien en tant que paire ( titre comme clé et lien comme valeur )

Réponses:


183

Il n'y a pas de clé dans les tableaux JavaScript. Utilisez des objets à cette fin.

var obj = {};

$.getJSON("displayjson.php",function (data) {
    $.each(data.news, function (i, news) {
        obj[news.title] = news.link;
    });                      
});

// later:
$.each(obj, function (index, value) {
    alert( index + ' : ' + value );
});

En JavaScript, les objets remplissent le rôle de tableaux associatifs. Sachez que les objets n'ont pas un "ordre de tri" défini lors de leur itération (voir ci-dessous).

Cependant , dans votre cas, je ne comprends pas vraiment pourquoi vous transférez des données à partir de l'objet d'origine ( data.news). Pourquoi ne passez-vous pas simplement une référence à cet objet?


Vous pouvez combiner des objets et des tableaux pour obtenir une itération et un comportement clé / valeur prévisibles :

var arr = [];

$.getJSON("displayjson.php",function (data) {
    $.each(data.news, function (i, news) {
        arr.push({
            title: news.title, 
            link:  news.link
        });
    });                      
});

// later:
$.each(arr, function (index, value) {
    alert( value.title + ' : ' + value.link );
});

30

Ce code

var title = news.title;
var link = news.link;
arr.push({title : link});

ne fait pas ce que vous pensez qu'il fait. Ce qui est poussé est un nouvel objet avec un seul membre nommé "titre" et avec linkcomme valeur ... la titlevaleur réelle n'est pas utilisée. Pour enregistrer un objet avec deux champs, vous devez faire quelque chose comme

arr.push({title:title, link:link});

ou avec les dernières avancées Javascript, vous pouvez utiliser le raccourci

arr.push({title, link}); // Note: comma "," and not colon ":"

La chose la plus proche d'un tuple python serait à la place

arr.push([title, link]);

Une fois que vous avez vos objets ou des tableaux dans le arrtableau , vous pouvez obtenir les valeurs soit comme value.titleet value.linkou, dans le cas de la version du tableau poussé, comme value[0], value[1].


17
arr[title] = link;

Vous ne poussez pas dans le tableau, vous définissez l'élément avec la clé titlesur la valeur link. En tant que tel, votre tableau doit être un objet.


17

Je pense que vous devez définir un objet, puis insérer un tableau

var obj = {};
obj[name] = val;
ary.push(obj);

2

Vous pourriez vouloir dire ceci:

var unEnumeratedArray = [];
var wtfObject = {
                 key    : 'val', 
                 0      : (undefined = 'Look, I\'m defined'),
                 'new'  : 'keyword', 
                 '{!}'  : 'use bracket syntax',
                 '        ': '8 spaces'
                };

for(var key in wtfObject){
    unEnumeratedArray[key] = wtfObject[key];
}
console.log('HAS KEYS PER VALUE NOW:', unEnumeratedArray, unEnumeratedArray[0], 
             unEnumeratedArray.key, unEnumeratedArray['new'], 
             unEnumeratedArray['{!}'], unEnumeratedArray['        ']);

Vous pouvez définir un énumérable pour un objet comme: ({})[0] = 'txt';et vous pouvez définir une clé pour un tableau comme:([])['myKey'] = 'myVal';

J'espère que cela t'aides :)

En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.