Frage Finden Sie Objekt nach ID in einem Array von JavaScript-Objekten


Ich habe ein Array:

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

Ich kann die Struktur des Arrays nicht ändern. Ich werde eine ID von übergeben 45und ich möchte es bekommen 'bar' für dieses Objekt im Array.

Wie mache ich das in JavaScript oder mit jQuery?


1104
2017-09-09 15:42


Ursprung


Antworten:


Benutze die find() Methode:

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

Von MDN:

Das find() Methode gibt einen Wert im Array zurück, wenn ein Element im Array die angegebene Testfunktion erfüllt. Andernfalls undefined ist zurück gekommen.


Wenn du es finden willst Index stattdessen verwenden findIndex():

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

Von MDN:

Das findIndex() Methode gibt den Index des ersten Elements im Array zurück, das die angegebene Testfunktion erfüllt. Andernfalls wird -1 zurückgegeben.


Wenn Sie ein Array mit übereinstimmenden Elementen erhalten möchten, verwenden Sie die filter() Methode stattdessen:

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

Dies wird ein Array von Objekten zurückgeben. Wenn Sie ein Array von erhalten möchten foo Eigenschaften, können Sie dies mit dem tun map() Methode:

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

Randnotiz: Methoden wie find() oder filter(), und Pfeilfunktionen werden von älteren Browsern (wie IE) nicht unterstützt. Wenn Sie diese Browser also unterstützen möchten, sollten Sie Ihren Code mit Babel (mit dem Polyfill).


427
2018-02-14 21:11



Da Sie bereits jQuery verwenden, können Sie die Grep Funktion, die zum Suchen eines Arrays gedacht ist:

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

Das Ergebnis ist ein Array mit den gefundenen Elementen. Wenn Sie wissen, dass das Objekt immer vorhanden ist und nur einmal vorkommt, können Sie es einfach verwenden result[0].foo um den Wert zu erhalten. Andernfalls sollten Sie die Länge des resultierenden Arrays überprüfen. Beispiel:

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



Eine andere Lösung besteht darin, ein Suchobjekt zu erstellen:

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

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

Dies ist besonders interessant, wenn Sie viele Nachschlagevorgänge durchführen müssen.

Dies wird nicht viel mehr Speicher benötigen, da die IDs und Objekte geteilt werden.


343
2017-09-09 15:50



ECMAScript 2015 bietet die finden() Methode für Arrays:

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);

Es funktioniert ohne externe Bibliotheken. Aber wenn du willst ältere Browserunterstützung Vielleicht möchtest du es mit einschließen diese Polyfill.


146
2018-02-10 22:32



Underscore.js hat eine schöne Methode dafür:

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



Ich denke, der einfachste Weg wäre der folgende, aber es funktioniert nicht mit Internet Explorer 8 (oder früher):

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



Versuche Folgendes

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



Eine generische und flexiblere Version der findById-Funktion oben:

// 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