objetos - ¿La mejor manera de almacenar una matriz de clave=> valor en JavaScript?

guardar datos en un array javascript

Question

¿Cuál es la mejor manera de almacenar una matriz key=>value en javascript, y cómo se puede enlazar?

La clave de cada elemento debe ser una etiqueta, como {id} o solo id y el valor debe ser el valor numérico de la identificación.

Debe ser el elemento de una clase javascript existente o ser una variable global a la que se pueda hacer referencia fácilmente a través de la clase.

jQuery puede ser utilizado.

Answer 1

En javascript, una matriz de valores clave se almacena como un objeto. Hay cosas tales como matrices en javascript, pero también se consideran algo objetos, comprueba la respuesta de estos tipos: ¿Cuál es la diferencia entre una matriz y un objeto?

Normalmente, las matrices se ven usando sintaxis de corchetes cuadrados y objetos (matrices "clave => valor") usando la sintaxis de corchetes, aunque puede acceder y establecer las propiedades de los objetos usando la sintaxis de corchetes cuadrados como lo ha demostrado Alexey Romanov.

Las matrices en javascript se usan normalmente solo con teclas numéricas y automáticas, pero los objetos javascript pueden contener pares de valores clave, funciones e incluso otros objetos.

Arreglo simple, por ej.

$(document).ready(function(){

    var countries = [''Canada'',''Us'',''France'',''Italy''];
    console.log(''I am from ''+countries[0]);
    $.each(countries, function(key, value) {
        console.log(key, value);
    });

});

Salida -

0 "Canadá"

1 "Nosotros"

2 "Francia"

3 "Italia"

Vemos arriba que podemos hacer un bucle en una matriz numérica usando la función jQuery.each y acceder a la información fuera del bucle usando corchetes cuadrados con teclas numéricas.

Objeto simple (json)

$(document).ready(function(){

    var person = {
        name: "James",
        occupation: "programmer",
        height: {
            feet: 6,
            inches: 1
        },
    }

    console.log("My name is "+person.name+" and I am a "+person.height.feet+" ft "+person.height.inches+" "+person.occupation);

    $.each(person, function(key, value) {
        console.log(key, value);
    });

});

Salida -

Mi nombre es James y soy un programador de 6 pies 1

nombre James

programador de ocupaciones

altura Objeto {pies: 6, pulgadas: 1}

En un lenguaje como php esto se consideraría una matriz multidimensional con pares de valores clave o una matriz dentro de una matriz. Supongo que, debido a que preguntaste cómo recorrer un conjunto de valores de clave, querrás saber cómo obtener un objeto (clave => matriz de valores) como el objeto de persona de arriba para tener, digamos, más de una persona.

Bueno, ahora que sabemos que las matrices javascript se usan típicamente para la indexación numérica y los objetos de forma más flexible para la indexación asociativa, las usaremos juntas para crear una matriz de objetos que podamos recorrer, como ese:

Matriz JSON (matriz de objetos) -

$(document).ready(function(){

    var people = [
        {
            name: "James",
            occupation: "programmer",
            height: {
                feet: 6,
                inches: 1
            }
        }, {
            name: "Peter",
            occupation: "designer",
            height: {
                feet: 4,
                inches: 10
            }
        }, {
            name: "Joshua",
            occupation: "CEO",
            height: {
                feet: 5,
                inches: 11
            }
        }
    ];

    console.log("My name is "+people[2].name+" and I am a "+people[2].height.feet+" ft "+people[2].height.inches+" "+people[2].occupation+"/n");

    $.each(people, function(key, person) {
        console.log("My name is "+person.name+" and I am a "+person.height.feet+" ft "+person.height.inches+" "+person.occupation+"/n");
    });

});

Salida -

Mi nombre es Joshua y soy un CEO de 5 pies 11

Mi nombre es James y soy un programador de 6 pies 1

Mi nombre es Peter y soy un diseñador de 4 pies 10

Mi nombre es Joshua y soy un CEO de 5 pies 11

Tenga en cuenta que fuera del ciclo tengo que usar la sintaxis de corchetes con una clave numérica porque ahora se trata de una matriz de objetos indexada numéricamente y, por supuesto, dentro del bucle está implícita la clave numérica.

Answer 2

Eso es exactamente lo que es un objeto de JavaScript:

var myArray = {id1: 100, id2: 200, "tag with spaces": 300};
myArray.id3 = 400;
myArray["id4"] = 500;

Puede recorrerlo usando for..in loop :

for (var key in myArray) {
  console.log("key " + key + " has value " + myArray[key]);
}

Ver también: Trabajar con objetos (MDN).

En ECMAScript6 también hay un Map (consulte la tabla de compatibilidad del navegador allí):

• Un objeto tiene un prototipo, por lo que hay claves predeterminadas en el mapa. Esto podría evitarse usando map = Object.create (null) desde ES5, pero rara vez se hizo.

• Las teclas de un objeto son cadenas y símbolos, donde pueden ser cualquier valor para un mapa.

• Puede obtener el tamaño de un Mapa fácilmente mientras tiene que realizar un seguimiento manual del tamaño de un Objeto.

Answer 3

Puedes usar Map .

• Una nueva estructura de datos introducida en JavaScript ES6.
• Alternativa al objeto JavaScript para almacenar pares clave / valor.
• Tiene métodos útiles para la iteración sobre los pares clave / valor.

var map = new Map();
map.set(''name'', ''John'');
map.set(''id'', 11);

// Get the full content of the Map
console.log(map); // Map { ''name'' => ''John'', ''id'' => 11 }

Obtener valor del mapa usando la clave

console.log(map.get(''name'')); // John 
console.log(map.get(''id'')); // 11

Obtener tamaño del mapa

console.log(map.size); // 2

La clave de verificación existe en el Mapa

console.log(map.has(''name'')); // true
console.log(map.has(''age'')); // false

Obtener llaves

console.log(map.keys()); // MapIterator { ''name'', ''id'' }

Obtener valores

console.log(map.values()); // MapIterator { ''John'', 11 }

Obtener elementos del mapa

for (let element of map) {
  console.log(element);
}

// Output:
// [ ''name'', ''John'' ]
// [ ''id'', 11 ]

Imprimir pares de valores clave

for (let [key, value] of map) {
  console.log(key + " - " + value);
}

// Output: 
// name - John
// id - 11

Imprima solo las teclas del mapa

for (let key of map.keys()) {
  console.log(key);
}

// Output:
// name
// id

Imprima solo valores del Mapa

for (let value of map.values()) {
  console.log(value);
}

// Output:
// John
// 11

Answer 4

Sé que es tarde, pero podría ser útil para aquellos que quieren otras formas. Otra forma en que se pueden almacenar los valores de key => es usando un método de matriz llamado map (); ( https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map ) también puedes usar la función de flecha

    var countries = [''Canada'',''Us'',''France'',''Italy''];  
    // Arrow Function  
    countries.map((value, key) => key+ '' : '' + value );  
    // Anonomous Function  
    countries.map(function(value, key){  
         return key + " : " + value;  
    });  
    

Answer 5

Si te entendí correctamente:

var hash = {};
hash[''bob''] = 123;
hash[''joe''] = 456;

var sum = 0;
for (var name in hash) {
    sum += hash[name];
}
alert(sum); // 579