Question Recherche d'objet par identifiant dans un tableau d'objets JavaScript


J'ai un tableau:

myArray = [{'id':'73','foo':'bar'},{'id':'45','foo':'bar'}, etc.]

Je suis incapable de changer la structure du tableau. Je suis passé un identifiant de 45et je veux avoir 'bar' pour cet objet dans le tableau.

Comment faire cela en JavaScript ou en utilisant jQuery?


1104
2017-09-09 15:42


origine


Réponses:


Utilisez le find() méthode:

myArray.find(x => x.id === '45').foo;

De MDN:

le find() La méthode renvoie une valeur dans le tableau, si un élément du tableau satisfait la fonction de test fournie. Autrement undefined est retourné.


Si vous voulez trouver son indice Au lieu de cela, utilisez findIndex():

myArray.findIndex(x => x.id === '45');

De MDN:

le findIndex() La méthode renvoie l'indice du premier élément du tableau qui satisfait à la fonction de test fournie. Sinon, -1 est renvoyé.


Si vous voulez obtenir un tableau d'éléments correspondants, utilisez le filter() méthode à la place:

myArray.filter(x => x.id === '45');

Cela retournera un tableau d'objets. Si vous voulez obtenir un tableau de foo propriétés, vous pouvez le faire avec le map() méthode:

myArray.filter(x => x.id === '45').map(x => x.foo);

Note de côté: des méthodes comme find() ou filter(), et fonctions de flèche ne sont pas supportés par les navigateurs les plus anciens (comme IE), donc si vous voulez supporter ces navigateurs, vous devriez transpiler votre code en utilisant Babel (avec le polyfill).


427
2018-02-14 21:11



Comme vous utilisez déjà jQuery, vous pouvez utiliser le grep fonction qui est destinée à la recherche dans un tableau:

var result = $.grep(myArray, function(e){ return e.id == id; });

Le résultat est un tableau avec les éléments trouvés. Si vous savez que l'objet est toujours là et qu'il ne se produit qu'une seule fois, vous pouvez simplement utiliser result[0].foo pour avoir la valeur. Sinon, vous devriez vérifier la longueur du tableau résultant. Exemple:

if (result.length == 0) {
  // not found
} else if (result.length == 1) {
  // access the foo property using result[0].foo
} else {
  // multiple items found
}

1420
2017-09-09 15:54



Une autre solution consiste à créer un objet de recherche:

var lookup = {};
for (var i = 0, len = array.length; i < len; i++) {
    lookup[array[i].id] = array[i];
}

... now you can use lookup[id]...

Ceci est particulièrement intéressant si vous avez besoin de faire beaucoup de recherches.

Cela n'aura pas besoin de beaucoup plus de mémoire puisque les ID et les objets seront partagés.


343
2017-09-09 15:50



ECMAScript 2015 fournit le trouver() méthode sur les tableaux:

var myArray = [
 {id:1, name:"bob"},
 {id:2, name:"dan"},
 {id:3, name:"barb"},
]

// grab the Array item which matchs the id "2"
var item = myArray.find(item => item.id === 2);

// print
console.log(item.name);

Cela fonctionne sans bibliothèques externes. Mais si tu veux support de navigateur plus ancien vous pourriez vouloir inclure ce polyfill.


146
2018-02-10 22:32



Underscore.js a une bonne méthode pour ça:

myArray = [{'id':'73','foo':'bar'},{'id':'45','foo':'bar'},etc.]
obj = _.find(myArray, function(obj) { return obj.id == '45' })

138
2017-11-22 12:52



Je pense que le moyen le plus simple serait le suivant, mais il ne fonctionnera pas sur Internet Explorer 8 (ou plus tôt):

var result = myArray.filter(function(v) {
    return v.id === '45'; // Filter out the appropriate one
})[0].foo; // Get result and access the foo property

123
2017-09-09 15:46



Essayez le suivant

function findById(source, id) {
  for (var i = 0; i < source.length; i++) {
    if (source[i].id === id) {
      return source[i];
    }
  }
  throw "Couldn't find object with id: " + id;
}

64
2017-09-09 15:45



myArray.filter(function(a){ return a.id == some_id_you_want })[0]

42
2018-04-16 17:31



Une version générique et plus flexible de la fonction findById ci-dessus:

// array = [{key:value},{key:value}]
function objectFindByKey(array, key, value) {
    for (var i = 0; i < array.length; i++) {
        if (array[i][key] === value) {
            return array[i];
        }
    }
    return null;
}

var array = [{'id':'73','foo':'bar'},{'id':'45','foo':'bar'}];
var result_obj = objectFindByKey(array, 'id', '45');

30
2017-07-13 20:34



Vous pouvez utiliser des filtres,

  function getById(id, myArray) {
    return myArray.filter(function(obj) {
      if(obj.id == id) {
        return obj 
      }
    })[0]
  }

get_my_obj = getById(73, myArray);

13
2017-09-13 09:43