Comment obtenir toutes les valeurs de propriétés d'un Objet Javascript (sans connaître les clés)?

Selon les navigateurs qui ont à soutenir, ce qui peut être fait dans un certain nombre de façons. L'écrasante majorité des navigateurs, dans la nature du soutien ECMAScript 5 (ES5), mais sachez que la plupart des exemples ci-dessous utilisent Object.keys, ce qui n'est pas disponible dans IE < 9. Voir la tableau de compatibilité.

ECMAScript 3+

Si vous avez à prendre en charge les anciennes versions d'IE, c'est l'option pour vous:

for (var key in obj) {
    if (Object.prototype.hasOwnProperty.call(obj, key)) {
        var val = obj[key];
        //use val
    }
}

Imbriquée if permet de s'assurer que vous n'avez pas d'énumérer plus de propriétés dans la chaîne de prototype de l'objet (qui est le comportement que vous voudrez certainement). Vous devez utiliser

Object.prototype.hasOwnProperty.call(obj, key) //ok

plutôt que

obj.hasOwnProperty(key) //bad

parce que ECMAScript 5+ vous permet de créer prototypeless objets avec Object.create(null), et que ces objets n'auront pas le hasOwnProperty méthode. Coquine code peut également produire des objets qui remplacent les hasOwnProperty méthode.

ECMAScript 5+

Vous pouvez utiliser ces méthodes dans n'importe quel navigateur qui prend en charge ECMAScript 5 et au-dessus. Ces valeurs d'un objet et d'éviter l'énumération sur la chaîne de prototype. Où obj est votre objet:

var keys = Object.keys(obj);

for (var i = 0; i < keys.length; i++) {
    var val = obj[keys[i]];
    //use val
}

Si vous voulez quelque chose d'un peu plus compact ou vous voulez être prudent avec les fonctions de boucles, puis Array.prototype.forEach est votre ami:

Object.keys(obj).forEach(function (key) {
    var val = obj[key];
    //use val
});

La méthode suivante crée un tableau contenant les valeurs d'un objet. C'est pratique pour faire des boucles plus.

var vals = Object.keys(obj).map(function (key) {
    return obj[key];
});

//use vals array

Si vous voulez faire de ceux qui utilisent Object.keys sûre contre null (comme for-in est), alors vous pouvez faire Object.keys(obj || {})....

Object.keys retourne énumérable propriétés. Pour itérer sur des objets simples, ce qui est généralement suffisant. Si vous avez quelque chose de non-énumérable propriétés que vous avez besoin pour travailler avec, vous pouvez utiliser Object.getOwnPropertyNames en place de Object.keys.

ECMAScript 2015+ (A. K. A. ES6)

Tableaux sont plus faciles à itérer avec ECMAScript 2015. Vous pouvez l'utiliser à votre avantage lorsque l'on travaille avec des valeurs une par une dans une boucle:

for (const key of Object.keys(obj)) {
    const val = obj[key];
    //use val
}

À l'aide de ECMAScript 2015 gras-flèche fonctions, la cartographie de l'objet à un tableau de valeurs devient un one-liner:

const vals = Object.keys(obj).map(key => obj[key]);

//use vals array

ECMAScript 2015 introduit Symbol, dont les instances peuvent être utilisés comme noms de propriété. Pour obtenir les symboles d'un objet d'énumérer plus, l'utilisation Object.getOwnPropertySymbols (cette fonction est pourquoi Symbol ne peut pas être utilisé pour faire des propriétés privées). La nouvelle Reflect API de ECMAScript 2015 fournit Reflect.ownKeys, qui renvoie une liste des noms de propriété (y compris les non-énumérable) et des symboles.

Tableau des compréhensions (ne pas tenter d'utiliser)

Tableau interprétations ont été retiré de ECMAScript 6 avant la publication. Avant leur enlèvement, une solution aurait ressemblé:

const vals = [for (key of Object.keys(obj)) obj[key]];

//use vals array

ECMAScript 2017+

ECMAScript 2016 ajoute des fonctionnalités qui ne touchent pas à ce sujet. L'ECMAScript 2017 spécification ajoute Object.values et Object.entries. Elles renvoient toutes les deux tableaux (ce qui peut être surprenant pour certains, compte tenu de l'analogie avec Array.entries). Object.values peut être utilisé tel quel ou avec un for-of boucle.

const values = Object.values(obj);

//use values array or:

for (const val of Object.values(obj)) {
    //use val
}

Si vous souhaitez utiliser à la fois la clé et la valeur, puis Object.entries est fait pour vous. Elle produit un tableau rempli avec [key, value] paires. Vous pouvez l'utiliser comme est, ou (note également l'ECMAScript 2015 déstructuration du travail) dans un for-of boucle:

for (const [key, val] of Object.entries(obj)) {
    //use key and val
}

Object.values cale

Enfin, comme indiqué dans les commentaires et par teh_senaus dans une autre réponse, il peut être intéressant d'utiliser l'un de ces comme une cale. Ne vous inquiétez pas, la suite ne change pas le prototype, il ajoute juste une méthode pour Object (ce qui est beaucoup moins dangereux). À l'aide de graisse flèche fonctions, ce qui peut être fait en une ligne de trop:

Object.values = obj => Object.keys(obj).map(key => obj[key]);

lesquelles vous pouvez maintenant utiliser comme

//['one', 'two', 'three']
var values = Object.values({ a: 'one', b: 'two', c: 'three' });

Si vous voulez éviter de calage lorsqu'un natif Object.values existe, alors vous pouvez faire:

Object.values = Object.values || (obj => Object.keys(obj).map(key => obj[key]));

Enfin...

Être conscient des navigateurs/versions vous avez besoin de soutien. Le ci-dessus sont correctes lorsque les méthodes ou des fonctionnalités de langage sont mis en œuvre. Pour exemple, le soutien à ECMAScript 2015 a été éteint par défaut en V8 jusqu'à récemment, qui a propulsé les navigateurs tels que Chrome. Caractéristiques de ECMAScript 2015 devrait être évitée jusqu'à ce que les navigateurs que vous avez l'intention à l'appui de mettre en œuvre les fonctionnalités dont vous avez besoin. Si vous utilisez babel pour compiler votre code ECMAScript 5, vous avez accès à toutes les fonctionnalités de cette réponse.

Si vous avez accès à Underscore.js, vous pouvez utiliser le _.les valeurs de fonction comme ceci:

_.values({one : 1, two : 2, three : 3}); //return [1, 2, 3]

ES5 de l'Objet.les touches

var a = { a: 1, b: 2, c: 3 };
Object.keys(a).map(function(key){ return a[key] });
//result: [1,2,3]

Pour ceux début de l'adaptation de gens sur le CofeeScript ère, voici un autre équivalent.

val for key,val of objects

Qui peut être mieux que cela, car les objects peut être réduite à être tapé à nouveau et une diminution de la lisibilité.

objects[key] for key of objects

Apparemment - que j'ai appris récemment - c'est le moyen le plus rapide de le faire:

var objs = {...};
var objKeys = Object.keys(obj);
for (var i = 0, objLen = objKeys.length; i < objLen; i++) {
    //do whatever in here
    var obj = objs[objKeys[i]];
}

Utilisation: Object.values(), nous passons à un objet comme argument et de recevoir un tableau de valeurs en tant que valeur de retour.

Ce retourne un tableau d'un objet donné propres énumération des valeurs de propriété. Vous obtiendrez les mêmes valeurs que par l'aide de la for in boucle, mais sans les propriétés sur le Prototype. Cet exemple sera probablement rendre les choses plus claires:

JS:

function person (name) {
  this.name = name;
}

person.prototype.age = 5;

let dude = new person('dude');

for(let prop in dude) {
  console.log(dude[prop]);     //for in still shows age because this is on the prototype
}                              //we can use hasOwnProperty but this is not very elegant

//ES6 + 
console.log(Object.values(dude));
//very concise and we don't show props on prototype

Compatible avec ES7 même certains navigateurs ne supportent pas encore

Depuis , Object.values(<object>) sera intégré dans ES7 &

En attente jusqu'à ce que tous les navigateurs pour le soutenir , vous pouvez l'enrouler à l'intérieur d'une fonction :

Object.vals=(o)=>(Object.values)?Object.values(o):Object.keys(o).map((k)=>o[k])

Alors :

Object.vals({lastname:'T',firstname:'A'})
 //['T','A']

Une fois que les navigateurs soient compatibles avec ES7, vous n'aurez pas à changer quoi que ce soit dans votre code.

Objet.les entrées de le faire dans une meilleure façon.

JS:

  var dataObject = {"a":{"title":"shop"}, "b":{"title":"home"}}
 
   Object.entries(dataObject).map(itemArray => { 
     console.log("key=", itemArray[0], "value=", itemArray[1])
  })

dans ECMAScript5 utilisation

 keys = Object.keys(object);

Sinon, si vous êtes navigateur ne le supporte pas, utiliser le for..in loop

for (key in object) {
    //your code here
}

utilisation

console.log(variable)

et si vous utilisez google chrome, ouvrez la Console en utilisant les touches Ctrl+Maj+j

Goto >> Console