web-dev-qa-db-fra.com

Trouver une valeur dans un tableau d'objets en Javascript

Je sais que des questions similaires ont déjà été posées, mais celle-ci est un peu différente. J'ai un tableau d'objets non nommés, qui contiennent un tableau d'objets nommés, et j'ai besoin d'obtenir l'objet où "nom" est "chaîne 1". Voici un exemple de tableau.

var array = [
    { name:"string 1", value:"this", other: "that" },
    { name:"string 2", value:"this", other: "that" }
];

Mise à jour: J'aurais dû le dire plus tôt, mais une fois que je l'ai trouvé, je souhaite le remplacer par un objet modifié.

287
Arlen Beiler

Vous pouvez parcourir le tableau et tester cette propriété:

function search(nameKey, myArray){
    for (var i=0; i < myArray.length; i++) {
        if (myArray[i].name === nameKey) {
            return myArray[i];
        }
    }
}

var array = [
    { name:"string 1", value:"this", other: "that" },
    { name:"string 2", value:"this", other: "that" }
];

var resultObject = search("string 1", array);
191
Asciiom

Trouver l'élément de tableau:

let arr = [
    { name:"string 1", value:"this", other: "that" },
    { name:"string 2", value:"this", other: "that" }
];

let obj = arr.find(o => o.name === 'string 1');

console.log(obj);

Remplacement de l'élément de tableau:

let arr = [
    { name:"string 1", value:"this", other: "that" },
    { name:"string 2", value:"this", other: "that" }
];

let obj = arr.find((o, i) => {
    if (o.name === 'string 1') {
        arr[i] = { name: 'new string', value: 'this', other: 'that' };
        return true; // stop searching
    }
});

console.log(arr);
599
Šime Vidas

Dans ES6 , vous pouvez utiliser Array.prototype.find(predicate, thisArg?) comme suit:

array.find(x => x.name === 'string 1')

http://exploringjs.com/es6/ch_arrays.html#_searching-for-array-elementshttps://developer.mozilla.org/en/docs/Web/JavaScript/ Référence/Global_Objects/Array/find

Pour ensuite remplacer ledit objet (et utiliser une autre méthode cool ES6 fill), vous pourriez faire quelque chose comme:

let obj = array.find(x => x.name === 'string 1');
let index = array.indexOf(obj);
array.fill(obj.name='some new string', index, index++);
126
rujmah

Selon ECMAScript 6, vous pouvez utiliser la fonction findIndex.

array[array.findIndex(x => x.name == 'string 1')]
36
p.pradnya

avec underscore.js utilisez la méthode findWhere:

var array = [
    { name:"string 1", value:"this", other: "that" },
    { name:"string 2", value:"this", other: "that" }
];


var result = _.findWhere(array, {name: 'string 1'});

console.log(result.name);

Voir ceci dans JSFIDDLE

20
Wallace Maxters
var array = [
    { name:"string 1", value:"this", other: "that" },
    { name:"string 2", value:"this", other: "that" }
];

var foundValue = array.filter(obj=>obj.name==='string 1');

console.log(foundValue);
19
Zahirul Haque

Soit utilisez une simple boucle for-:

_var result = null;
for (var i = 0; i < array.length; i++) { 
  if (array[i].name === "string 1") { 
    result = array[i];
    break;
  } 
}
_

Ou si vous le pouvez, c'est-à-dire si votre navigateur le supporte, utilisez Array.filter , ce qui est beaucoup plus concis:

_var result = array.filter(function (obj) {
  return obj.name === "string 1";
})[0];
_
14
João Silva

Considérant que vous avez l'extrait suivant:

var array = [
    { name:"string 1", value:"this", other: "that" },
    { name:"string 2", value:"this", other: "that" }
];

Vous pouvez utiliser la fonction suivante pour rechercher des éléments

const search = what => array.find(element => element.name === what);

Et vous pouvez vérifier si l'élément a été trouvé ou non.

if (search("string 1")) {
    console.log(search.value, search.other);
} else {
    console.log('No result found');
}
13
Gaurav Sharma

Réponse en une ligne. Vous pouvez utiliser la fonction de filtrage pour obtenir un résultat.

var array = [
    { name:"string 1", value:"this", other: "that" },
    { name:"string 2", value:"this", other: "that" }
];

console.log(array.filter(function(arr){return arr.name == 'string 1'})[0]);
12
Durgpal Singh

Avec une foreach:

let itemYouWant = null;
array.forEach((item) => {
    if (item.name === 'string 1') {
        itemYouWant = item;
    }
});
console.log(itemYouWant);
11
MarvinVK

Nouvelle réponse

J'ai ajouté l'accessoire comme paramètre, pour le rendre plus général et réutilisable

/**
 * Represents a search trough an array.
 * @function search
 * @param {Array} array - The array you wanna search trough
 * @param {string} key - The key to search for
 * @param {string} [prop] - The property name to find it in
 */

function search(array, key, prop){
    // Optional, but fallback to key['name'] if not selected
    prop = (typeof prop === 'undefined') ? 'name' : prop;    

    for (var i=0; i < array.length; i++) {
        if (array[i][prop] === key) {
            return array[i];
        }
    }
}

Usage:

var array = [
    { 
        name:'string 1', 
        value:'this', 
        other: 'that' 
    },
    { 
        name:'string 2', 
        value:'this', 
        other: 'that' 
    }
];

search(array, 'string 1');
// or for other cases where the prop isn't 'name'
// ex: prop name id
search(array, 'string 1', 'id');

Test de moka:

var assert = require('chai').assert;

describe('Search', function() {
    var testArray = [
        { 
            name: 'string 1', 
            value: 'this', 
            other: 'that' 
        },
        { 
            name: 'string 2', 
            value: 'new', 
            other: 'that' 
        }
    ];

    it('should return the object that match the search', function () {
        var name1 = search(testArray, 'string 1');
        var name2 = search(testArray, 'string 2');

        assert.equal(name1, testArray[0]);
        assert.equal(name2, testArray[1]);

        var value1 = search(testArray, 'this', 'value');
        var value2 = search(testArray, 'new', 'value');

        assert.equal(value1, testArray[0]);
        assert.equal(value2, testArray[1]);
    });

    it('should return undefined becuase non of the objects in the array have that value', function () {
        var findNonExistingObj = search(testArray, 'string 3');

        assert.equal(findNonExistingObj, undefined);
    });

    it('should return undefined becuase our array of objects dont have ids', function () {
        var findById = search(testArray, 'string 1', 'id');

        assert.equal(findById, undefined);
    });
});

résultats de test:

Search
    ✓ should return the object that match the search
    ✓ should return undefined becuase non of the objects in the array have that value
    ✓ should return undefined becuase our array of objects dont have ids


  3 passing (12ms)

Ancienne réponse - supprimée en raison de mauvaises pratiques

si vous voulez en savoir plus sur la raison d’une mauvaise pratique, consultez cet article:

Pourquoi l'extension d'objets natifs est-elle une mauvaise pratique?

Version prototype de la recherche dans un tableau:

Array.prototype.search = function(key, prop){
    for (var i=0; i < this.length; i++) {
        if (this[i][prop] === key) {
            return this[i];
        }
    }
}

Usage:

var array = [
    { name:'string 1', value:'this', other: 'that' },
    { name:'string 2', value:'this', other: 'that' }
];

array.search('string 1', 'name');
10
Simon Dragsbæk

Vous pouvez le faire avec une simple boucle:

var obj = null;    
for (var i = 0; i < array.length; i++) {
    if (array[i].name == "string 1") {
        obj = array[i];
        break;
    }
}
4
VisioN

Une autre façon (pour aider @NullUserException et les commentaires de @ Wexoni) est de récupérer l'index de l'objet dans le tableau, puis de partir de là:

var index = array.map(function(obj){ return obj.name; }).indexOf('name-I-am-looking-for');
// Then we can access it to do whatever we want
array[index] = {name: 'newName', value: 'that', other: 'rocks'};
3
Keegan G

Semblable aux réponses précédentes, j'ai utilisé ce qui suit:

    Array.prototype.getIemtByParam = function(paramPair) {
      var key = Object.keys(paramPair)[0];
      return this.find(function(item){return ((item[key] == paramPair[key]) ? true: false)});
    }

usage:

myArray.getIemtByParam(
    {name: 'Sasha'}
);
2
Alexander Levakov

si vous utilisez jQuery, essayez $ .grep ().

http://api.jquery.com/jquery.grep/

1
sucil

Recherchez-vous une recherche générique (filtre) sur l'élément de la liste d'objets sans spécifier sa clé?

Entrée

var productList = [{category: 'Sporting Goods', price: '$49.99', stocked: true, name: 'Football'}, {category: 'Sporting Goods', price: '$9.99', stocked: true, name: 'Baseball'}, {category: 'Sporting Goods', price: '$29.99', stocked: false, name: 'Basketball'}, {category: 'Electronics', price: '$99.99', stocked: true, name: 'iPod Touch'}, {category: 'Electronics', price: '$399.99', stocked: false, name: 'iPhone 5'}, {category: 'Electronics', price: '$199.99', stocked: true, name: 'Nexus 7'}]
function customFilter(objList, text){
if(undefined === text || text === '' ) return objList;
return objList.filter(product => {
    let flag;
    for(let prop in product){
        flag = false;
        flag = product[prop].toString().indexOf(text) > -1;
        if(flag)
        break;
    }
return flag;
});}

Execute

customFilter(productList, '$9');

enter image description here

1
Ratheesh

Vous pouvez utiliser query-objects à partir de npm. Vous pouvez rechercher un tableau d'objets à l'aide de filtres.

const queryable = require('query-objects');

const users = [
    {
      firstName: 'George',
      lastName: 'Eracleous',
      age: 28
    },
    {
      firstName: 'Erica',
      lastName: 'Archer',
      age: 50
    },
    {
      firstName: 'Leo',
      lastName: 'Andrews',
      age: 20
    }
];

const filters = [
    {
      field: 'age',
      value: 30,
      operator: 'lt'
    },
    {
      field: 'firstName',
      value: 'Erica',
      operator: 'equals'
    }
];

// Filter all users that are less than 30 years old AND their first name is Erica
const res = queryable(users).and(filters);

// Filter all users that are less than 30 years old OR their first name is Erica
const res = queryable(users).or(filters);
0
George Eracleous
function getValue(){
    for(var i = 0 ; i< array.length; i++){
        var obj = array[i];
        var arr = array["types"];
        for(var j = 0; j<arr.length;j++ ){
            if(arr[j] == "value"){
                return obj;
            }
        }

    }
}
0
user3264482

Voici la solution pour rechercher et remplacer

function searchAndUpdate(name,replace){
    var obj = array.filter(function ( obj ) {
        return obj.name === name;
    })[0];
    obj.name = replace;
}

searchAndUpdate("string 2","New String 2");
0
cse031sust02