Pronađite objekt po ID-u u nizu JavaScript objekata

Imam niz:

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

Ne mogu promijeniti strukturu polja. Dobivam ID 45 i želim dobiti 'bar' za ovaj objekt u nizu.

Kako to napraviti u javascriptu ili pomoću jQuery?

1195
09 сент. set by thugsb na 09 ruj . 2011-09-09 18:42 '11 u 18:42 2011-09-09 18:42
ответ 31 odgovor
  • 1
  • 2

Upotrijebite metodu find() :

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

Iz MDN-a :

Metoda find() vraća vrijednost u polje ako element u nizu zadovoljava zadanu testnu funkciju. Inače, vraća se undefined .


Ako želite pronaći njegov indeks, koristite findIndex() :

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

Iz MDN-a :

Metoda findIndex() vraća indeks prvog elementa u nizu koji zadovoljava findIndex() testnu funkciju. Inače, vraća -1.


Ako želite dobiti niz odgovarajućih elemenata, umjesto toga koristite filter() :

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

To će vratiti niz objekata. Ako želite dobiti niz svojstava foo , to možete učiniti pomoću map() :

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

Napomena: Metode kao što su find() ili filter() i funkcije strelica nisu podržane u starijim preglednicima (na primjer, IE), pa ako želite podržati te preglednike, morate pretvoriti svoj kod pomoću Babel (s polifonom ).

567
15 февр. Odgovor Michał Perłakowski 15. veljače. 2016-02-15 00:11 '16 u 0:11 2016-02-15 00:11

Budući da već koristite jQuery, možete koristiti funkciju grep za pretraživanje niza:

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

Rezultat je niz s pronađenim elementima. Ako znate da objekt uvijek postoji i da se pojavljuje samo jednom, možete jednostavno koristiti result[0].foo da biste dobili vrijednost. U suprotnom, trebali biste provjeriti duljinu dobivenog niza. primjer:

 if (result.length == 0) { // not found } else if (result.length == 1) { // access the foo property using result[0].foo } else { // multiple items found } 
1428
09 сент. odgovor je dat Guffa 09 sep . 2011-09-09 18:54 '11 u 18:54 2011-09-09 18:54

Drugo rješenje je izraditi objekt pretraživanja:

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

To je posebno zanimljivo ako trebate puno tražiti.

To ne zahtijeva puno više memorije, jer će se dijeliti identifikatori i objekti.

346
09 сент. Odgovor dao Aaron Digulla rujan 09 2011-09-09 18:50 '11 u 18:50 2011-09-09 18:50

ECMAScript 2015 daje metodu find () na nizovima:

stariju podršku za preglednike , možete omogućiti ovu polifill . 

154
11 февр. Odgovor daje Rúnar Berg 11. veljače. 2014-02-11 01:32 '14 u 1:32 2014-02-11 01:32

Underscore.js ima dobar način za to:

 myArray = [{'id':'73','foo':'bar'},{'id':'45','foo':'bar'},etc.] obj = _.find(myArray, function(obj) { return obj.id == '45' }) 
139
22 нояб. odgovor je dao GijsjanB 22 nov. 2012-11-22 15:52 '12 u 15:52 2012-11-22 15:52

Mislim da bi najlakši način bio kako slijedi, ali neće raditi u programu Internet Explorer 8 (ili ranije):

 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
09 сент. odgovor je dan pimvdb 09 sep . 2011-09-09 18:46 '11 u 18:46 2011-09-09 18:46

Pokušajte pokrenuti

 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; } 
65
09 сент. Odgovor je dao JaredPar rujan 09 2011-09-09 18:45 '11 u 18:45 2011-09-09 18:45
 myArray.filter(function(a){ return a.id == some_id_you_want })[0] 
42
16 апр. Odgovoriti Danilo Colasso 16. travnja 2015-04-16 20:31 '15 u 20:31 2015-04-16 20:31

Općenitija i fleksibilnija verzija funkcije findById veća je:

 // 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
13 июля '12 в 23:34 2012-07-13 23:34 odgovor će dati Farrell 13. srpnja '12 u 23:34 2012-07-13 23:34

To možete jednostavno dobiti pomoću funkcije map () :

 myArray = [{'id':'73','foo':'bar'},{'id':'45','foo':'bar'}]; var found = $.map(myArray, function(val) { return val.id == 45 ? val.foo : null; }); //found[0] == "bar"; 

Primjer rada: http://jsfiddle.net/hunter/Pxaua/

14
09 сент. odgovor dan lovac 09 rujan. 2011-09-09 18:46 '11 u 18:46 2011-09-09 18:46

Možete koristiti filtre,

  function getById(id, myArray) { return myArray.filter(function(obj) { if(obj.id == id) { return obj } })[0] } get_my_obj = getById(73, myArray); 
13
13 сент. Odgovori Joe Lewis 13. rujna 2013-09-13 12:43 '13 u 12:43 2013-09-13 12:43

Koristeći izvorni Array.reduce

 var array = [ {'id':'73' ,'foo':'bar'} , {'id':'45' ,'foo':'bar'} , ]; var id = 73; 
 var found = array.reduce(function(a, b){ return (a.id==id  a) || (b.id == id  b) }); 

vraća element objekta ako je pronađen, u suprotnom false

10
04 июня '15 в 3:13 2015-06-04 03:13 odgovor je dat laggingreflex 4. lipnja u 15 sati u 3:13 2015-06-04 03:13

Unatoč činjenici da postoji mnogo točnih odgovora, mnogi od njih ne uzimaju u obzir činjenicu da je to nepotrebno skupa operacija ako se izvodi više puta. U ekstremnom slučaju, to može biti uzrok stvarnih problema s performansama.

U stvarnom svijetu, ako obrađujete mnogo elemenata, a izvedba je mnogo brža nego u početku izrade pretraživanja:

 var items = [{'id':'73','foo':'bar'},{'id':'45','foo':'bar'}]; var lookup = items.reduce((o,i)=>o[i.id]=o,{}); 

Stavke možete dobiti u određeno vrijeme na sljedeći način:

 var bar = o[id]; 

Također možete koristiti kartu umjesto objekta kao pretraživanje: https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Map

10
23 марта '16 в 13:24 2016-03-23 13:24 odgovor je dat Tom 23 ožujak '16 u 13:24 2016-03-23 ​​13:24

Evo kako ću to učiniti u čistom javascriptu, na najmanji način koji se mogu sjetiti, koji radi u ECMAScript 3 ili novijem. Vraća se čim se pronađe podudarnost.

 var getKeyValueById = function(array, key, id) { var testArray = array.slice(), test; while(test = testArray.pop()) { if (test.id === id) { return test[key]; } } // return undefined if no matching id is found in array return; } var myArray = [{'id':'73', 'foo':'bar'}, {'id':'45', 'foo':'bar'}] var result = getKeyValueById(myArray, 'foo', '45'); // result is 'bar', obtained from object with id of '45' 
6
28 февр. Odgovor je dan Dan 28 Feb. 2015-02-28 21:04 '15 u 21:04 2015-02-28 21:04

Na temelju prihvaćenog odgovora:

jQuery

 var foo = $.grep(myArray, function(e){ return e.id === foo_id}) myArray.pop(foo) 

Ili CoffeeScript:

 foo = $.grep myArray, (e) -> e.id == foo_id myArray.pop foo 
4
23 окт. odgovor dao mr.musicman 23. listopada. 2014-10-23 17:23 '14 u 17:23 2014-10-23 17:23

Ako to učinite nekoliko puta, možete konfigurirati kartu (ES6):

 const map = new Map( myArray.map(el => [el.id, el]) ); 

Onda možete jednostavno učiniti:

 map.get(27).foo 
4
08 авг. Odgovor je dao Jonas Wilms 08 aug. 2017-08-08 18:26 '17 u 18:26 2017-08-08 18:26

Možete probati Sugarjs s http://sugarjs.com/ .

To je vrlo slatka metoda u nizovima .find Dakle, možete pronaći ovaj element:

 array.find( {id: 75} ); 

Također možete proslijediti objekt s više svojstava da biste dodali još jednu "where-clause".

Napominjemo da Sugarjs proširuje izvorne objekte, a neki ga smatraju vrlo zlim ...

4
06 нояб. odgovor se daje duboko 06. studenog. 2012-11-06 11:52 '12 u 11:52 2012-11-06 11:52

Ponovite postupak nad bilo kojim elementom polja. Za svaku stavku koju posjećujete, označite ovu stavku. Ako je slučajnost, vratite je.

Ako trebate samo kôd:

 function getId(array, id) { for (var i = 0, len = array.length; i < len; i++) { if (array[i].id === id) { return array[i]; } } return null; // Nothing found } 

Isto, koristeći metode polja ECMAScript 5 Array:

 function getId(array, id) { var obj = array.filter(function (val) { return val.id === id; }); // Filter returns an array, and we just want the matching item. return obj[0]; } 
3
09 сент. odgovor je dat Zirak 09 sep . 2011-09-09 18:46 '11 u 18:46 2011-09-09 18:46

To možete učiniti čak iu čistom JavaScriptu koristeći ugrađenu funkciju "filtera" za nizove:

 Array.prototype.filterObjects = function(key, value) { return this.filter(function(x) { return x[key] === value; }) } 

Dakle, umjesto "t22" umjesto "t22" umjesto "t21" i "45", jednostavno prolazite u "id", i dobivate kompletan objekt koji odgovara identifikatoru 45. Dakle, to će biti

 myArr.filterObjects("id", "45"); 
3
26 окт. odgovor je dat kaizer1v 26. listopada. 2014-10-26 07:39 '14 u 7:39 2014-10-26 07:39

Sve dok preglednik podržava ECMA-262 , 5. izdanje (prosinac 2009.), to bi trebalo raditi s gotovo jednim slojem:

 var bFound = myArray.some(function (obj) { return obj.id === 45; }); 
2
08 апр. odgovor je dat aggaton 08 apr. 2014-04-08 20:14 '14 u 20:14 2014-04-08 20:14

Koristite funkciju Array.prototype.filter() .

DEMO : https://jsfiddle.net/sumitridhal/r0cz0w5o/4/

JSON

 var jsonObj =[ { "name": "Me", "info": { "age": "15", "favColor": "Green", "pets": true } }, { "name": "Alex", "info": { "age": "16", "favColor": "orange", "pets": false } }, { "name": "Kyle", "info": { "age": "15", "favColor": "Blue", "pets": false } } ]; 

FILTER

 var getPerson = function(name){ return jsonObj.filter(function(obj) { return obj.name === name; }); } 
2
02 мая '17 в 18:40 2017-05-02 18:40 odgovor je dao Sumit Ridhal 02. svibnja '17 u 18:40 2017-05-02 18:40

Zaista mi se svidio odgovor koji je dao Aaron Digulla, ali morao sam spasiti svoj niz objekata kako bih ga nastavio. Tako sam ga promijenio

2
19 нояб. odgovor je dan quincyaft 19. studenog 2014-11-19 06:55 '14 u 6:55 2014-11-19 06:55

Upotreba:

 var retObj ={}; $.each(ArrayOfObjects, function (index, obj) { if (obj.id === '5') { // id.toString() if it is int retObj = obj; return false; } }); return retObj; 

Mora vratiti objekt prema idu.

1
28 февр. odgovor dano volumexxx 28. veljače. 2013-02-28 18:03 '13 u 18:03 2013-02-28 18:03

Ovo rješenje također može pomoći:

 Array.prototype.grep = function (key, value) { var that = this, ret = []; this.forEach(function (elem, index) { if (elem[key] === value) { ret.push(that[index]); } }); return ret.length < 2 ? ret[0] : ret; }; var bar = myArray.grep("id","45"); 

Učinio sam to kao $.grep , a ako se pronađe jedan objekt, funkcija vraća objekt, a ne niz.

1
22 окт. odgovor dati soytian 22. listopada 2014-10-22 12:15 '14 u 12:15 2014-10-22 12:15

Češće i kraće

 function findFromArray(array,key,value) { return array.filter(function (element) { return element[key] == value; }).shift(); } 

u vašem slučaju Ex. var element = findFromArray(myArray,'id',45) , koji će vam dati cijeli element.

0
12 дек. Odgovor daje Savan Kaneriya 12. prosinca. 2018-12-12 09:35 '18 u 9:35 2018-12-12 09:35

Možemo koristiti Jquery $ .each () / $ metode. Grep () var data= []; $.each(array,function(i){if(n !== 5 я > 4){data.push(item)}} var data= []; $.each(array,function(i){if(n !== 5 я > 4){data.push(item)}} var data= []; $.each(array,function(i){if(n !== 5 я > 4){data.push(item)}}

ili

var data = $.grep(array, function( n, я ) { return ( n !== 5 я > 4 ); });

koristiti ES6 sintaksu: Array.find, Array.filter, Array.forEach, Array.map

Ili upotrijebite https://lodash.com/docs/4.17.10#filter , podcrtajte https://underscorejs.org/#filter

0
25 сент. Odgovor je dat TLbiz 25. rujna. 2018-09-25 09:49 '18 u 9:49 201-09-09 09:49

Počevši od aggaton odgovora , ovo je funkcija koja zapravo vraća željeni element (ili null ako nije pronađen), daje array i callback , koji vraća pravu vrijednost za "ispravan" element:

 function findElement(array, callback) { var elem; return array.some(function(e) { if (callback(e)) { elem = e; return true; } }) ? elem : null; }); 

Samo zapamtite da ne radi na IE8, jer ne podržava some . Može se ponuditi polifil, alternativno, uvijek postoji klasična petlja:

 function findElement(array, callback) { for (var i = 0; i < array.length; i++) if (callback(array[i])) return array[i]; return null; }); 

Zapravo je brži i kompaktniji. Ali ako ne želite ponovno izmisliti točak, predlažem da koristite knjižnicu s pomoćnim programima, kao što je podcrtavanje ili lodash.

0
02 сент. odgovor daje MaxArt 02. rujna. 2014-09-02 15:41 '14 u 15:41 2014-09-02 15:41

Razmotrite "axesOptions" kao niz objekata s formatom objekta koji je {: field_type => 2 ,: polja => [1,3,4]}

 function getFieldOptions(axesOptions,choice){ var fields=[] axesOptions.each(function(item){ if(item.field_type == choice) fields= hashToArray(item.fields) }); return fields; } 
0
04 марта '15 в 9:06 2015-03-04 09:06 odgovor daje ramya 04. ožujka u 9:06 sati 2015-03-04 09:06

Najkraće

 var theAnswerObj = _.findWhere(array, {id : 42}); 
0
03 янв. odgovor je dao Manu Jan 03 2015-01-03 06:52 '15 u 6:52 2015-01-03 06:52

Moj način pronalaženja indeksa niza je:

 index = myArray.map(getItemId).indexOf(id); getItemId: function(item) { return item.id; } // to get foo property use index myArray[index].foo //If you want to use ES6 index = myArray.map((i) => i.id).indexOf(id) myArray[index].foo 
-3
24 мая '16 в 5:28 2016-05-24 05:28 odgovor je dao Vu Truong 24. svibnja '16 u 5:28 2016-05-24 05:28
  • 1
  • 2