objeto - map javascript

Usando objetos en For Of Loops

Question

¿Por qué no es posible usar objetos para bucles? ¿O es esto un error del navegador? Este código no funciona en Chrome 42, diciendo que indefinido no es una función:

test = { first: "one"}

for(var item of test) {
  console.log(item)
}

Answer 1

Iterador, Iterable y for..of loop en ECMAScript 2015 / ES6

let tempArray = [1,2,3,4,5];

for(element of tempArray) {
  console.log(element);
}

// 1
// 2
// 3
// 4
// 5

Pero si lo hacemos

let tempObj = {a:1, b:2, c:3};

for(element of tempObj) {
   console.log(element);
}
// error

Obtenemos un error porque for..of loop solo funciona en Iterables , es decir, el objeto que tiene un iterador @@ que se adhiere al protocolo Iterator , lo que significa que debe tener un objeto con el siguiente método. El siguiente método no toma argumentos y debería devolver un objeto con estas dos propiedades.

hecho : indica que la secuencia ha finalizado cuando es verdadero, y falso significa que puede haber más valores de valor : este es el elemento actual en la secuencia

Por lo tanto, para hacer que un objeto sea Iterable es hacer que funcione para ... de lo que podemos:

1 .Haga que un objeto sea Iterable asignándole a su propiedad mística @@ iterator a través de la propiedad Symbol.iterator. Aquí es cómo:

let tempObj = {a:1, b:2, c:3};

tempObj[Symbol.iterator]= () => ({
next: function next () {
return {
    done: Object.keys(this).length === 0,
    value: Object.keys(this).shift()
     }
    }
  })

for(key in tempObj){
 console.log(key)
}
// a
// b
// c

2.Utilice Object.entries , que devuelve un Iterable :

let tempObj = {a:1, b:2, c:3};

for(let [key, value] of Object.entries(tempObj)) {
    console.log(key, value);
}
// a 1
// b 2
// c 3

3.Utilice Object.keys , así es como:

let tempObj = {a:1, b:2, c:3};
for (let key of Object.keys(tempObj)) {
    console.log(key);
}

// a
// b
// c

¡¡¡¡¡¡Espero que esto ayude!!!!!!

Answer 2

¿Qué hay de usar

function* entries(obj) {
    for (let key of Object.keys(obj)) {
        yield [key, obj[key]];
    }
}

for ([key, value] of entries({a: "1", b: "2"})) {
    console.log(key + " " + value);
}

Answer 3

¿Qué tal usar Object.keys para obtener una matriz de claves? ¿Y luego para cada Array ?

obj = { a: 1, b:2}
Object.keys(obj).forEach( key => console.log(`${key} => ${obj[key]}`))

Answer 4

Acabo de hacer lo siguiente para consolar fácilmente mis cosas.

for (let key in obj) {
  if(obj.hasOwnProperty(key){
    console.log(`${key}: ${obj[key]}`);
  }
}

Answer 5

El bucle for..of solo admite objetos iterables como matrices, no objetos.

Para iterar sobre los valores de un objeto, use:

for (var key in test) {
    var item = test[key];
}

Answer 6

Es posible definir un iterador sobre cualquier objeto de donación, de esta manera puede poner una lógica diferente para cada objeto

var x = { a: 1, b: 2, c: 3 }
x[Symbol.iterator] = function* (){
    yield 1;
    yield ''foo'';
    yield ''last''
}

Luego solo itera directamente x

for (let i in x){
    console.log(i);
}
//1
//foo
//last

Es posible hacer lo mismo en el objeto Object.prototype y tener un iterador general para todos los objetos

Object.prototype[Symbol.iterator] = function*() {
    for(let key of Object.keys(this)) {
         yield key 
    } 
 }

luego itera tu objeto así

var t = {a :''foo'', b : ''bar''}
for(let i of t){
    console.log(t[i]);
}

O de esta manera

var it = t[Symbol.iterator](), p;
while(p = it.next().value){
    console.log(t[p])
}

Answer 7

Hice objetos iterables con este código:

Object.prototype[Symbol.iterator] = function*() {
 for(let key of Object.keys(this)) {
  yield([ key, this[key] ])
} }

Uso:

for(let [ key, value ] of {}) { }

Alternativamente:

for(let [ key, value ] of Object.entries({})) { }

Answer 8

La respuesta es No. No es posible usar For..Of con literales Object.

Estoy de acuerdo con Overv en que For..Of es solo para iterables. Tenía exactamente la misma pregunta porque uso objetos para iterar sobre claves y valores con for..in. Pero me acabo de dar cuenta de que para eso sirven ES6 MAPS y Set .

let test = new Map();
test.set(''first'', "one");
test.set(''second'', "two");

for(var item of test) {
  console.log(item); // "one" "two"
}

Por lo tanto, logra el objetivo de no tener que usar for..In (validando con hasOwnProperty ) y no tener que usar Object.keys ().

Además, sus claves no se limitan a cadenas. Puede usar números, objetos u otros literales.

Answer 9

Los literales de objeto no tienen iteradores integrados, que son necesarios para trabajar con for...of bucles. Sin embargo, si no quiere pasar por la molestia de agregar su propio [Symbol.iterator] a su objeto, simplemente puede usar el método Object.keys() . Este método devuelve un objeto Array , que ya tiene un iterador incorporado, por lo que puede usarlo con un bucle for...of como este:

const myObject = {
    country: "Canada",
    province: "Quebec",
    city: "Montreal"
}

for (let i of Object.keys(myObject)) {
    console.log("Key:", i, "| Value:", myObject[i]);
}

//Key: country | Value: Canada
//Key: province | Value: Quebec
//Key: city | Value: Montreal

Answer 10

Porque el objeto literal no tiene la propiedad Symbol.iterator . Para ser específico, solo puede iterar sobre String , Array , Map , Set , arguments , NodeList (no es ampliamente compatible) y Generator con for ... of loop.

Para lidiar con la iteración de Object Literal, tiene dos opciones.

para ... en

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

Object.keys + forEach

Object.keys(obj).forEach(function(key){
    console.log(obj[key]);
});

Answer 11

Puedes usar esta sintaxis:

const foo = { a: ''foo'', z: ''bar'', m: ''baz'' };
for (let value of Object.values(foo)) {
    console.log(value);
}

Sin embargo, Object.entries tiene poco apoyo en este momento no funciona en IE o iOS Safari . Tu probablemente podría necesitar un polyfill

Answer 12

Si está almacenando datos en una tienda de valores clave, utilice Map que está específicamente diseñado para este propósito.

Sin embargo, si tiene que usar un objeto, ES2017 (ES8) le permite usar Object.values :

var obj = { a: ''foo'', z: ''bar'', m: ''baz'' };
Object.keys(obj).forEach(function (prop) {
    var value = obj[prop];
    console.log(value);
});

Si eso aún no es compatible, use un polyfill: versión alternativa para Object.values()

Y, por último, si admite un entorno anterior que no admite esta sintaxis, tendrá que recurrir al uso de forEach y Object.keys :

let myObject = {first: "one"};

for(let [key, value] of Object.entries(myObject)) {
    console.log(key, value); // "first", "one"
}

Answer 13

Usando Array Destruction puedes forEach siguiente manera usando forEach

const obj = { a: 5, b: 7, c: 9 };

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

Answer 14

en ES6 podrías ir con generador:

var obj = {1: ''a'', 2: ''b''};

function* entries(obj) {
  for (let key of Object.keys(obj)) {
    yield [key, obj[key]];
  }
}

let generator = entries(obj);

let step1 = generator.next();
let step2 = generator.next();
let step3 = generator.next();

console.log(JSON.stringify(step1)); // {"value":["1","a"],"done":false}
console.log(JSON.stringify(step2)); // {"value":["2","b"],"done":false}
console.log(JSON.stringify(step3)); // {"done":true}

Aquí está el jsfiddle. En la salida obtendrá un objeto con las teclas "value" y "done" . "Value" contiene todo lo que quiere que tenga y "done" es el estado actual de la iteración en bool.