Comment obtenir les paires clé-valeur d'un objet à l'aide de la fonction Object.entries ?

Comment utiliser la fonction Object.entries pour obtenir la paire clé-valeur d'un objet ?

En programmation JavaScript, nous devons souvent opérer sur les paires clé-valeur d'objets. La méthode Object.entries introduite dans ES2017 peut nous aider à obtenir rapidement les paires clé-valeur d'objets. Cet article présentera l'utilisation de Object.entries, avec des exemples de code spécifiques.

1. Utilisation de base de Object.entries
La fonction Object.entries reçoit un objet en paramètre et renvoie un tableau bidimensionnel contenant la paire clé-valeur de l'objet. où chaque élément du tableau est un petit tableau contenant une clé et une valeur.

Par exemple, nous avons un objet :
const person = {
nom : "John",
âge : 30,
sexe : "male"
};

Si nous voulons obtenir la paire clé-valeur du person, nous pouvons utiliser la fonction Object.entries :
const inputs = Object.entries(person);

Après avoir exécuté le code ci-dessus, la valeur des entrées sera un tableau bidimensionnel contenant toutes les paires clé-valeur de la personne ; objet :
[
["name", " John"],
["age", 30],
["gender", "male"]
]

2. Parcourez les paires clé-valeur
Après avoir obtenu le paires clé-valeur de l'objet, nous pouvons utiliser for... ou une boucle les parcourt ou utilise la méthode forEach pour les parcourir.

1. Utiliser la boucle for...of pour parcourir
   La boucle for...of est une nouvelle fonctionnalité introduite dans ES6, qui peut facilement parcourir des tableaux ou des objets de type tableau.

Ensuite, nous prenons l'objet personne comme exemple et utilisons une boucle for...of pour parcourir les paires clé-valeur de l'objet personne :
for (const [clé, valeur] de Object.entries(person)) {
console.log(${key} : ${value});${key}: ${value});
}

执行以上代码后，控制台将输出：
name: John
age: 30
gender: male

2. 使用forEach方法遍历
   除了for...of循环外，我们也可以使用数组的forEach方法对Object.entries返回的数组进行遍历。

同样以person对象为例，使用forEach方法遍历person对象的键值对：
Object.entries(person).forEach(([key, value]) => {
console.log(${key}: ${value}}

Après avoir exécuté le code ci-dessus, la console affichera :

nom : John
age : 30
sexe : male

Traverse en utilisant la méthode forEach

En plus de la boucle for...of, nous pouvons également utiliser la méthode forEach du tableau pour parcourir le tableau renvoyé par Object.entries.


En prenant également l'objet personne comme exemple, utilisez la méthode forEach pour parcourir les paires clé-valeur de l'objet personne :

Object.entries(person).forEach(([key, value]) => {

console.log( ${key} : ${value});
});

Après avoir exécuté le code ci-dessus, la console affichera le même résultat :
name : John
age : 30

genre : masculin


3. Utilisez Object.entries pour cloner des objets

La fonction Object.entries peut non seulement obtenir les paires clé-valeur des objets, mais également nous aider à cloner des objets.
Nous pouvons convertir un tableau bidimensionnel contenant des paires clé-valeur en un nouvel objet en combinant la méthode Object.fromEntries.


Par exemple, nous avons un objet personne :

const person = {

nom : "John",

âge : 30,🎜 sexe : "male"🎜} ;🎜🎜Maintenant, nous voulons créer un objet avec une personne en clonage Un nouvel objet avec le même contenu d'objet. Nous pouvons utiliser Object.entries et Object.fromEntries pour accomplir cette tâche : 🎜const clonedPerson = Object.fromEntries(Object.entries(person)); 🎜🎜Après avoir exécuté le code ci-dessus, clonedPerson sera un nouvel objet dont le contenu est le même. comme la personne s'y oppose. Exactement la même chose. 🎜🎜Résumé🎜La fonction Object.entries est une nouvelle méthode introduite dans ES2017, qui peut nous aider à obtenir rapidement les paires clé-valeur des objets. En utilisant une boucle for...of ou la méthode forEach d'un tableau, nous pouvons facilement parcourir ces paires clé-valeur. De plus, combiné avec la méthode Object.fromEntries, nous pouvons également cloner des objets via Object.entries. 🎜🎜J'espère que cet article vous aidera à comprendre l'utilisation de la fonction Object.entries. Dans la programmation JavaScript quotidienne, une utilisation appropriée de Object.entries peut faciliter l'exploitation des paires clé-valeur d'objets. 🎜

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!