objetos - object object javascript

¿Cómo iterar sobre un objeto JavaScript?

Question

Tengo un objeto en JavaScript:

{
    abc: ''...'',
    bca: ''...'',
    zzz: ''...'',
    xxx: ''...'',
    ccc: ''...'',
    // ...
}

Quiero usar un bucle for para obtener sus propiedades. Y quiero iterarlo en partes (no todas las propiedades del objeto a la vez).

Con una simple matriz puedo hacerlo con un estándar for loop:

for (i = 0; i < 100; i++) { ... } // first part
for (i = 100; i < 300; i++) { ... } // second
for (i = 300; i < arr.length; i++) { ... } // last

¿Pero cómo hacerlo con los objetos?

Answer 1

Aquí hay otra solución de iteración para los navegadores modernos:

Object.keys(obj).filter(function(k, i) {
    return i >= 100 && i < 300;
}).forEach(function(k) {
    console.log(obj[k]);
});

O incluso más corto:

Object.keys(obj).forEach(function(k, i) {
    if (i >= 100 && i < 300) {
        console.log(obj[k]);
    }
});

Sin embargo, debe tener en cuenta que las propiedades en el objeto JavaScript no están ordenadas, es decir, no tienen orden.

Answer 2

Con las nuevas características de ES6 / ES2015, ya no tiene que usar un objeto para iterar sobre un hash. Puedes usar un Map . Los mapas de Javascript mantienen las claves en orden de inserción, lo que significa que puede recorrerlas sin tener que verificar la propiedad de propiedad de hasOwn, que siempre fue un hack.

Iterar sobre un mapa:

var myMap = new Map();
myMap.set(0, "zero");
myMap.set(1, "one");
for (var [key, value] of myMap) {
  console.log(key + " = " + value);
}
// Will show 2 logs; first with "0 = zero" and second with "1 = one"

for (var key of myMap.keys()) {
  console.log(key);
}
// Will show 2 logs; first with "0" and second with "1"

for (var value of myMap.values()) {
  console.log(value);
}
// Will show 2 logs; first with "zero" and second with "one"

for (var [key, value] of myMap.entries()) {
  console.log(key + " = " + value);
}
// Will show 2 logs; first with "0 = zero" and second with "1 = one"

o use forEach:

myMap.forEach(function(value, key) {
  console.log(key + " = " + value);
}, myMap)
// Will show 2 logs; first with "0 = zero" and second with "1 = one"

Answer 3

Finalmente se me ocurrió una útil función de utilidad con una interfaz unificada para iterar objetos, cadenas, matrices, arrays de Typed, mapas, conjuntos (cualquier iterable).

const iterate = require(''@a-z/iterate-it'');
const obj = { a: 1, b: 2, c: 3 };

iterate(obj, (value, key) => console.log(key, value)); 
// a 1
// b 2
// c 3

https://github.com/alrik/iterate-javascript

Answer 4

La única forma confiable de hacer esto sería guardar los datos de su objeto en 2 matrices, una de las claves y una para los datos:

var keys = [];
var data = [];
for (var key in obj) {
    if (obj.hasOwnProperty(key)) {
        keys.push(key);
        data.push(obj[key]); // Not necessary, but cleaner, in my opinion. See the example below.
    }
}

A continuación, puede recorrer las matrices como lo haría normalmente:

for(var i = 0; i < 100; i++){
    console.log(keys[i], data[i]);
    //or
    console.log(keys[i], obj[keys[i]]); // harder to read, I think.
}
for(var i = 100; i < 300; i++){
    console.log(keys[i], data[i]);
}

No estoy usando Object.keys(obj) , porque eso es IE 9+.

Answer 5

Para la iteración de objetos usualmente usamos un bucle for..in . Esta estructura recorrerá todas las propiedades enumerables , incluidas aquellas que se heredan a través de la herencia prototípica. Por ejemplo:

let obj = {
  prop1: ''1'',
  prop2: ''2''
}

for(let el in obj) {
  console.log(el);
  console.log(obj[el]);
}

Sin embargo, for..in recorrerá todos los elementos enumerables y esto no nos permitirá dividir la iteración en partes. Para lograr esto, podemos usar la función Object.keys() incorporada para recuperar todas las claves de un objeto en una matriz. Luego podemos dividir la iteración en múltiples para bucles y acceder a las propiedades usando la matriz de claves. Por ejemplo:

let obj = {
  prop1: ''1'',
  prop2: ''2'',
  prop3: ''3'',
  prop4: ''4'',
};

const keys = Object.keys(obj);
console.log(keys);


for (let i = 0; i < 2; i++) {
  console.log(obj[keys[i]]);
}


for (let i = 2; i < 4; i++) {
  console.log(obj[keys[i]]);
}

Answer 6

Para la mayoría de los objetos, use for .. in :

for (var key in yourobject) {
  console.log(key, yourobject[key]);
}

Con ES6, si necesita claves y valores simultáneamente, haga

for (let [key, value] of Object.entries(yourobject)) {
    console.log(key, value);
}

Para evitar el registro de propiedades heredadas, verifique con hasOwnProperty :

for (var key in yourobject) {
   if (yourobject.hasOwnProperty(key)) {
      console.log(key, yourobject[key]);
   }
}

Esta documentación de MDN explica de manera más general cómo tratar los objetos y sus propiedades.

Si desea hacerlo "en trozos", lo mejor es extraer las claves de una matriz. Como el orden no está garantizado, esta es la forma correcta. En los navegadores modernos, puede utilizar

var keys = Object.keys(yourobject);

Para ser más compatible, es mejor que hagas esto:

 var keys = [];
 for (var key in yourobject) {      
     if (yourobject.hasOwnProperty(key)) keys.push(key);
 }

Luego puede iterar sus propiedades por índice: yourobject[keys[i]] :

for (var i=300; i<keys.length && i<600; i++) { 
   console.log(keys[i], yourobject[keys[i]]);
}

Answer 7

Puede intentar usar lodash: una moderna biblioteca de utilidades de JavaScript que ofrece modularidad, rendimiento y extras js para una rápida iteración de objetos: -

var  users  =   {
    ''fred'':     { 
        ''user'':   ''fred'',
            ''age'':  40 
    },
    ''pebbles'':  { 
        ''user'':   ''pebbles'',
         ''age'':  1 
    }
}; 
_.mapValues(users,  function(o)  { 
    return  o.age; 
});
// => { ''fred'': 40, ''pebbles'': 1 } (iteration order is not guaranteed)
// The `_.property` iteratee shorthand.
console.log(_.mapValues(users,  ''age'')); // returns age property & value 
console.log(_.mapValues(users,  ''user'')); // returns user property & value 
console.log(_.mapValues(users)); // returns all objects 
// => { ''fred'': 40, ''pebbles'': 1 } (iteration order is not guaranteed)

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash-compat/3.10.2/lodash.js"></script>

Answer 8

Realmente un PITA no es parte del Javascript estándar.

/**
 * Iterates the keys and values of an object.  Object.keys is used to extract the keys.
 * @param object The object to iterate
 * @param fn (value,key)=>{}
 */
function objectForEach(object, fn) {
    Object.keys(object).forEach(key => {
        fn(object[key],key, object)
    })
}

Nota: cambié los parámetros de devolución de llamada a (valor, clave) y agregué un tercer objeto para hacer que la API sea consistente con otras API.

Usalo asi

const o = {a:1, b:true};
objectForEach(o, (value, key, obj)=>{
    // do something
});

Answer 9

Si desea la clave y el valor al iterar, puede usar un ciclo for...of con Object.entries .

const myObj = {a: 1, b: 2}

for (let [key, value] of Object.entries(myObj)) {
    console.log(`key=${key} value=${value}`)
}

// output: 
// key=a value=1
// key=b value=2

Answer 10

Si quisiera iterar todo el objeto de una vez, podría usarlo for in loop:

for (var i in obj) {
  ...
}

Pero si quieres dividir el objeto en partes, de hecho no puedes. No hay garantía de que las propiedades en el objeto estén en ningún orden especificado. Por lo tanto, puedo pensar en dos soluciones.

El primero de ellos es "eliminar" las propiedades ya leídas:

var i = 0;
for (var key in obj) {
    console.log(obj[key]);
    delete obj[key];
    if ( ++i > 300) break;
}

Otra solución que se me ocurre es usar Array of Arrays en lugar del objeto:

var obj = [[''key1'', ''value1''], [''key2'', ''value2'']];

Entonces, el estándar for bucle funcionará.

Answer 11

Usando Object.entries haces algo como esto.

 // array like object with random key ordering
 const anObj = { 100: ''a'', 2: ''b'', 7: ''c'' };
 console.log(Object.entries(anObj)); // [ [''2'', ''b''],[''7'', ''c''],[''100'', ''a''] ]

El método Object.entries () devuelve una matriz de la propiedad enumerable de un objeto dado [clave, valor]

Por lo tanto, puede recorrer el Objeto y tener la key y el value para cada uno de los objetos y obtener algo como esto.

const anObj = { 100: ''a'', 2: ''b'', 7: ''c'' };
Object.entries(anObj).map(obj => {
   const key   = obj[0];
   const value = obj[1];

   // do whatever you want with those values.
});

o así

// Or, using array extras
Object.entries(obj).forEach(([key, value]) => {
  console.log(`${key} ${value}`); // "a 5", "b 7", "c 9"
});

Para una referencia, eche un vistazo a los documentos de MDN para entradas de objetos

Answer 12

-> si iteramos sobre un objeto JavaScript usando y encontramos la clave de la matriz de objetos

Object.keys(Array).forEach(key => {

 console.log(''key'',key)

})

Answer 13

var Dictionary = {
  If: {
    you: {
      can: '''',
      make: ''''
    },
    sense: ''''
  },
  of: {
    the: {
      sentence: {
        it: '''',
        worked: ''''
      }
    }
  }
};

function Iterate(obj) {
  for (prop in obj) {
    if (obj.hasOwnProperty(prop) && isNaN(prop)) {
      console.log(prop + '': '' + obj[prop]);
      Iterate(obj[prop]);
    }
  }
}
Iterate(Dictionary);