¿La mejor manera de almacenar una matriz key => value en 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 simplemente 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 se puede utilizar.

Answer 1

Eso es justo lo que un objeto JavaScript es:

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

Puede bucle a través de él usando for..in loop:

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

Ver también: Working with objects (MDN).

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

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

• Las claves 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 2

Si he entendido bien:

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

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

Answer 3

en JavaScript una matriz clave de valor se almacena como un objeto. Hay cosas como arreglos en javascript, pero también se consideran objetos, compruebe la respuesta de este tipo: What is the difference between an array and an object?

Las matrices se suelen ver utilizando la sintaxis de corchetes cuadrados y los objetos (matrices "clave => valor") usando rizado sintaxis del paréntesis, aunque puede acceder y establecer las propiedades del objeto utilizando la sintaxis del paréntesis cuadrado como lo ha demostrado Alexey Romanov.

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

Arreglo simple eg.

$(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 nosotros puede recorrer una matriz numérica usando la función jQuery.each y acceder a la información fuera del bucle usando el cuadrado corchetes con teclas numéricas.

Simple Object (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 yo soy un 6 pies 1 programador

nombre de James

ocupación programador

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 de JavaScript se utilizan normalmente para la indexación numérica y los objetos con mayor flexibilidad para la indexación asociativa, vamos a utilizar juntos para crear una matriz de objetos que puede recorrer, al igual que -

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 yo soy un 5 pies 11 CEO

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

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

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

Nota 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 4

Sé que es tarde, pero podría ser útil para aquellos que quieren otras maneras. 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) puede utilizar la función de flecha también

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