Najlepszy sposób na przechowywanie klucza => tablica wartości w JavaScript?

Question

Jaki jest najlepszy sposób przechowywania tablicy key=>value w javascript i jak można ją przełączyć?

Kluczem każdego elementu powinien być znacznik, taki jak {id} lub po prostu id, a wartość powinna być wartością liczbową id.

Powinien to być element istniejącej klasy javascript lub być zmienną globalną, do której można łatwo odwoływać się za pośrednictwem klasy.

jQuery może być używany.

Answer 1

Właśnie to obiekt JavaScript jest:

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

Można pętla przez niego za pomocą for..in loop:

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

Zobacz także: Working with objects (MDN).

W ECMAScript6 istnieje również Map (patrz tabela kompatybilności tam przeglądarki):

• obiekt ma prototyp, więc istnieje domyślne klucze w mapie. Można to obejść za pomocą map = Object.create (null) od wersji ES5, ale rzadko było to robione.

• Kluczami obiektu są ciągi i symbole, gdzie mogą być dowolnymi wartościami dla mapy.

• Możesz łatwo uzyskać rozmiar mapy, podczas gdy musisz ręcznie śledzić rozmiar obiektu.

Answer 2

Jeśli ja zrozumiałem:

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

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

Answer 3

w JavaScript tablicą wartości jest przechowywany w obiekcie. W javascript są takie rzeczy, jak tablice, ale są one również w pewnym sensie uważane za obiekty, sprawdź tę odpowiedź - What is the difference between an array and an object?

Tablice są zwykle widziane przy użyciu składni nawiasów kwadratowych i obiektów (tablice "key => value") za pomocą kręcenia składnia nawiasów, chociaż można uzyskać dostęp i ustawić właściwości obiektu za pomocą składni nawias kwadratowy, jak pokazał Alexey Romanov.

Tablice w javascriptu są zwykle używane tylko z numerycznymi, automatycznie zwiększanymi kluczami, ale obiekty javascript mogą zawierać pary wartości klucza, funkcje, a nawet inne obiekty.

Prosta tablica np.

$(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); 
    }); 

}); 

Wyjście -

0 "Kanada"

1 "Us"

2 "Francja"

3 "Włochy"

Widzimy powyżej tego my może zapętlić tablicę liczbową za pomocą funkcji jQuery.each i uzyskać dostęp do informacji poza pętlą za pomocą kwadratu nawiasy z kluczami numerycznymi.

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); 
    }); 

}); 

Wyjście -

Nazywam się James i jestem 6 FT 1 programiście

nazwisko James

zawód programista

height Obiekt {stopy: 6, cale: 1}

W języku takim jak php będzie to traktowane jako wielowymiarowa tablica z parami klucz-wartość lub tablica w tablicy. Zakładam, że pytałeś o to, jak przechodzić przez tablicę wartości kluczy, którą chciałbyś wiedzieć, jak zdobyć obiekt (key => tablica wartości), tak jak powyższy obiekt osoby, powiedzmy, więcej niż jedną osobę.

Dobrze, że teraz wiemy, tablice javascript stosowane są zazwyczaj do indeksowania numerycznej i obiektów bardziej elastycznie do asocjacyjnej indeksowania użyjemy je razem, aby utworzyć tablicę obiektów, które możemy pętlę poprzez, jak tak -

tablica JSON (tablica obiektów) -

$(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"); 
    }); 

}); 

Wyjście -

Nazywam się Joshua i jestem 5 ft 11 CEO

Nazywam się James i jestem 6 FT 1 programiście

Nazywam się Piotr i jestem 4 ft 10 projektantowi

Nazywam się Joshua i jestem 5 ft 11 CEO

Uwaga poza pętlą muszę używać składni nawiasów kwadratowych z kluczem numerycznym, ponieważ jest to teraz tablica liczbowo indeksowanych tablic obiektów i oczywiście wewnątrz pętli jest implikowany klucz numeryczny.

Answer 4

Znam jego późno, ale może być pomocna dla tych, którzy chcą innych sposobów. Innym sposobem zapisania klucza tablicy => wartości jest użycie metody tablicowej o nazwie map(); (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map) można użyć funkcji strzałki również

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