logo

Com iterar sobre un objecte JavaScript?

En aquest article, aprendrem a iterar sobre un objecte JavaScript. Durant la iteració, recorreu les propietats de l'objecte una per una i, depenent del mètode que utilitzeu per a la iteració, és possible que tingueu un accés diferent a aquestes propietats.

Hi ha molts mètodes per iterar sobre un objecte que es discuteixen a continuació:



Taula de contingut

Mètode 1: Utilitzant per... en bucle

Les propietats de l'objecte es poden repetir mitjançant un bucle for..in. Aquest bucle s'utilitza per iterar sobre totes les propietats iterables no símbols d'un objecte. Alguns objectes poden contenir propietats que es poden heretar dels seus prototips. El hasOwnProperty() El mètode es pot utilitzar per comprovar si la propietat pertany a l'objecte en si. El valor de cada clau de l'objecte es pot trobar utilitzant la clau com a índex de l'objecte.

Sintaxi:

for (let key in exampleObj) {  if (exampleObj.hasOwnProperty(key)) {  value = exampleObj[key];  console.log(key, value);  } }>

Exemple: Aquest exemple mostra la implementació de l'enfocament explicat anteriorment.



Javascript
function iterateObject() {  let exampleObj = {  book: 'Sherlock Holmes',  author: 'Arthur Conan Doyle',  genre: 'Mystery'  };  for (let key in exampleObj) {  if (exampleObj.hasOwnProperty(key)) {  value = exampleObj[key];  console.log(key, value);  }  } } iterateObject();>

Sortida
book Sherlock Holmes author Arthur Conan Doyle genre Mystery>

Mètode 2: Utilitzant Mètode Object.entries(). i mapa () Mètode

El Mètode Object.entries(). s'utilitza per retornar una matriu dels parells de propietats de cadena enumerables de l'objecte. La matriu retornada s'utilitza amb el mapa () mètode per extreure la clau i el valor dels parells. La clau i els valors de la parella clau-valor es poden extreure accedint al primer i segon índex de la parella de matrius. El primer índex correspon a la clau i el segon índex correspon al valor de la parella.

Sintaxi:

Object.entries(exampleObj).map(entry =>{ let key = entrada[0];  deixar valor = entrada[1];  console.log(clau, valor); });>

Exemple: Aquest exemple mostra la implementació de l'enfocament explicat anteriorment.

Javascript
function iterateObject() {  let exampleObj = {  book: 'Sherlock Holmes',  author: 'Arthur Conan Doyle',  genre: 'Mystery'  };  Object.entries(exampleObj).map(entry =>{ let key = entrada[0];  deixar valor = entrada[1];  console.log(clau, valor);  }); } iterateObject();>>>  
Sortida
book Sherlock Holmes author Arthur Conan Doyle genre Mystery>

Mètode 3: Ús mètode forEach(). i object.keys() Mètode

Object.keys() retorna una matriu de claus de l'objecte iforEach()>és un mètode de matriu que us permet iterar sobre cada element de la matriu.



Exemple: Aquest exemple mostra la implementació de l'enfocament explicat anteriorment.

Javascript
function iterateObject() {  let exampleObj = {  book: 'Sherlock Holmes',  author: 'Arthur Conan Doyle',  genre: 'Mystery'  };  Object.keys(exampleObj).forEach(key =>{ valor constant = exempleObj[clau];  console.log(`${clau}: ${valor}`);  }); } iterateObject();>>>  
Sortida Mètode 4: Ús Mètode Lodash _.forOwn().

En aquest enfocament, estem utilitzant el mètode Lodash _.forOwn(), que ajuda a iterar a través dels objectes.

Exemple: Aquest exemple mostra la implementació de l'enfocament explicat anteriorment.

Javascript
// Defining Lodash variable  const _ = require('lodash'); let users = {  'a': 1,  'b': 2,  'c': 3 }; _.forOwn(users, function (value, key) {  console.log(key, '=', value); });>

Sortida:

El mètode Object.values() retorna una matriu dels propis valors de propietat enumerables de l'objecte. En combinar això amb el mètode forEach(), podeu iterar sobre cada valor. Per accedir també a les claus corresponents, podeu utilitzar el mètode Object.keys() en tàndem.

Sintaxi:

Object.values(exampleObj).forEach((value, index) =>{ clau const = Object.keys(exampleObj)[índex];  console.log(clau, valor); });>

Exemple:

JavaScript
function iterateObject() {  let exampleObj = {  book: 'Sherlock Holmes',  author: 'Arthur Conan Doyle',  genre: 'Mystery'  };  Object.values(exampleObj).forEach((value, index) =>{ clau const = Object.keys(exampleObj)[índex];  console.log(clau, valor);  }); } iterateObject();>>>  
Sortida