La méthode Object.entries() renvoie un tableau des propriétés propres énumérables d'un objet sous la forme de paires [clé, valeur], dans le même ordre qu'une boucle for...in (la boucle for-in est différente car elle parcourt la chaîne des prototypes).

L'ordre du tableau renvoyé par cette méthode ne dépend pas de la façon dont l'objet est défini. S'il faut garantir un certain ordre, on pourra utiliser la méthode Array.sort().

Syntaxe

Object.entries(obj)

Paramètres

obj
L'objet dont on souhaite connaître les propriétés propres énumérables sous la forme de paires [clé, valeur].

Valeur de retour

Un tableau qui contient les propriétés énumérables propres de l'objet sous la forme de paires [clé, valeur].

Description

Object.entries() renvoie un tableau dont les éléments sont des paires (des tableaux à deux éléments)  [clé, valeur] qui correspondent aux propriétés énumérables qui sont directement présentes sur l'objet passé en argument. L'ordre du tableau est le même que celui utilisé lorsqu'on parcourt les valeurs manuellement.

Exemples

var obj = { toto: "truc", machin: 42 };
console.log(Object.entries(obj)); // [ ['toto', 'truc'], ['machin', 42] ]

// Un objet semblable à un tableau
var obj = { 0: 'a', 1: 'b', 2: 'c' };
console.log(Object.entries(obj)); // [ ['0', 'a'], ['1', 'b'], ['2', 'c'] ]

// Un objet semblable à un tableau
// dont les clés sont aléatoirement ordonnées
var un_obj = { 100: 'a', 2: 'b', 7: 'c' };
console.log(Object.entries(un_obj)); // [ ['2', 'b'], ['7', 'c'], ['100', 'a'] ]

// getToto est une propriété non énumérable
var mon_obj = Object.create({}, { getToto: { value: function() { return this.toto; } } });
mon_obj.toto = "truc";
console.log(Object.entries(mon_obj)); // [ ['toto', 'truc'] ]

// un argument de type primitif sera
// converti en un objet
console.log(Object.entries("toto")); // [ ['0', 't'], ['1', 'o'], ['2', 't'],  ['3', 'o'] ]

// Un tableau vide pour les types primitifs qui n'ont pas de propriétés
console.log(Object.entries(100)); // [ ]

// parcourir les clés-valeurs
var autreObjet = {a:5, b:7, c:9};

for (var [cle, valeur] of Object.entries(autreObjet)){
  console.log(cle + ' ' + valeur);
}

// Ou encore, en utilisant les méthodes génériques
Object.entries(autreObjet).forEach(([clé, valeur]) => {
  console.log(clé + ' ' + valeur);
});

Convertir un objet en Map

Le constructeur new Map() accepte un argument itérable pour décrire les entrées du tableau associatif. Grâce à Object.entries, il est possible de convertir simplement un objet Object en un objet Map :

var obj = { toto: "truc", machin: 42 }; 
var map = new Map(Object.entries(obj));
console.log(map); // Map { toto: "truc", machin: 42 }

Parcourir un objet

En utilisant la décomposition des tableaux, on peut simplement parcourir les différentes propriétés d'un objet :

const obj = { toto: "truc", bidule: 42 };
Object.entries(obj).forEach(
  ([clé, valeur]) => console.log(`${clé}: ${valeur}`)
);
// "toto: truc"
// "bidule: 42"

Prothèse d'émulation (polyfill)

Afin d'ajouter le support pour Object.entries dans des environnements plus anciens qui ne supportent pas la méthode nativement, vous pouvez utiliser une prothèse comme celle proposée sur le dépôt tc39/proposal-object-values-entries ou sur le dépôt es-shims/Object.entries.

Vous pouvez également utiliser la prothèse suivante (qui nécessitera la prothèse pour Object.prototype.keys() si on souhaite être compatible avec IE 8 et les versions antérieures) :

if (!Object.entries) {
  Object.entries = function( obj ){
    var ownProps = Object.keys( obj ),
        i = ownProps.length,
        resArray = new Array(i);
    while (i--)
      resArray[i] = [ownProps[i], obj[ownProps[i]]];
    
    return resArray;
  };
}

Spécifications

Spécification État Commentaires
ECMAScript Latest Draft (ECMA-262)
La définition de 'Object.entries' dans cette spécification.
Projet  
ECMAScript 2017 (ECMA-262)
La définition de 'Object.entries' dans cette spécification.
Standard Définition initiale.

Compatibilité des navigateurs

Update compatibility data on GitHub
OrdinateurMobileServeur
ChromeEdgeFirefoxInternet ExplorerOperaSafariWebview AndroidChrome pour AndroidEdge MobileFirefox pour AndroidOpera pour AndroidSafari sur iOSSamsung InternetNode.js
Support simpleChrome Support complet 54Edge Support complet 14Firefox Support complet 47IE Aucun support NonOpera Support complet 41Safari Support complet 10.1WebView Android Support complet 54Chrome Android Support complet 54Edge Mobile Support complet OuiFirefox Android Support complet 47Opera Android Support complet 41Safari iOS Support complet 10.1Samsung Internet Android Support complet 6.0nodejs Support complet 7.0.0
Support complet 7.0.0
Support complet 6.5.0
Désactivée
Désactivée From version 6.5.0: this feature is behind the --harmony runtime flag.

Légende

Support complet  
Support complet
Aucun support  
Aucun support
Une action explicite de l'utilisateur est nécessaire pour activer cette fonctionnalité.
Une action explicite de l'utilisateur est nécessaire pour activer cette fonctionnalité.

Voir aussi

Étiquettes et contributeurs liés au document

Contributeurs à cette page : SphinxKnight
Dernière mise à jour par : SphinxKnight,