Mehrdimensionale assoziative Arrays in JavaScript

Es gibt die folgenden Abfrageergebnisse: (Schlüssel1 und Schlüssel2 können beliebiger Text sein)

id   key1     key2     value

1    fred     apple    2
2    mary     orange   10
3    fred     banana   7
4    fred     orange   4
5    sarah    melon    5
...

und ich möchte die Daten in einem Raster (möglicherweise als Array) speichern, das alle Datensätze wie folgt durchläuft :

         apple    orange   banana  melon
fred        2        4         7     -
mary        -        10        -     -
sarah       -        -         -     5

In PHP wäre dies mit assoziativen Arrays sehr einfach:

$result['fred']['apple'] = 2;

In JavaScript funktionieren solche assoziativen Arrays jedoch nicht. Nachdem ich Tonnen von Tutorials gelesen hatte, konnte ich nur Folgendes bekommen:

arr=[];
arr[1]['apple'] = 2;

arr['fred']['apple'] = 2;funktioniert aber nicht Ich habe Arrays von Objekten ausprobiert, aber Objekteigenschaften können kein Freitext sein. Je mehr ich Tutorials las, desto verwirrter wurde ich ...

Jede Idee ist willkommen :)

Verwenden Sie einfach ein reguläres JavaScript-Objekt, das genauso wie Ihre assoziativen Arrays "liest". Sie müssen daran denken, sie auch zuerst zu initialisieren.

var obj = {};

obj['fred'] = {};
if('fred' in obj ){ } // can check for the presence of 'fred'
if(obj.fred) { } // also checks for presence of 'fred'
if(obj['fred']) { } // also checks for presence of 'fred'

// The following statements would all work
obj['fred']['apples'] = 1;
obj.fred.apples = 1;
obj['fred'].apples = 1;

// or build or initialize the structure outright
var obj = { fred: { apples: 1, oranges: 2 }, alice: { lemons: 1 } };

Wenn Sie über Werte schauen, haben Sie möglicherweise etwas, das so aussieht:

var people = ['fred', 'alice'];
var fruit = ['apples', 'lemons'];

var grid = {};
for(var i = 0; i < people.length; i++){
    var name = people[i];
    if(name in grid == false){
        grid[name] = {}; // must initialize the sub-object, otherwise will get 'undefined' errors
    }

    for(var j = 0; j < fruit.length; j++){
        var fruitName = fruit[j];
        grid[name][fruitName] = 0;
    }
}

Wenn es nicht hat , ein Array sein, können Sie ein „mehrdimensionale“ JS - Objekt erstellen ...

<script type="text/javascript">
var myObj = { 
    fred: { apples: 2, oranges: 4, bananas: 7, melons: 0 }, 
    mary: { apples: 0, oranges: 10, bananas: 0, melons: 0 }, 
    sarah: { apples: 0, oranges: 0, bananas: 0, melons: 5 } 
}

document.write( myObject[ 'fred' ][ 'apples' ] );
</script>

Javascript ist flexibel:

var arr = {
  "fred": {"apple": 2, "orange": 4},
  "mary": {}
  //etc, etc
};

alert(arr.fred.orange);
alert(arr["fred"]["orange"]);
for (key in arr.fred)
    alert(key + ": " + arr.fred[key]);

Da ich alle Elemente auf eine nette Art und Weise erhalten musste, stieß ich auf dieses SO-Subjekt "Durchqueren eines zweidimensionalen assoziativen Arrays / Objekts" - unabhängig vom Namen für mich, da die Funktionalität zählt.

var imgs_pl = { 
    'offer':        { 'img': 'wer-handwritter_03.png', 'left': 1, 'top': 2 },
    'portfolio':    { 'img': 'wer-handwritter_10.png', 'left': 1, 'top': 2 },
    'special':      { 'img': 'wer-handwritter_15.png', 'left': 1, 'top': 2 }
};
for (key in imgs_pl) { 
    console.log(key);
    for (subkey in imgs_pl[key]) { 
        console.log(imgs_pl[key][subkey]);
    }
}

Es scheint, dass es für einige Anwendungen einen weitaus einfacheren Ansatz für mehrdimensionale assoziative Arrays in Javascript gibt.

1. Da die interne Darstellung aller Arrays tatsächlich Objekte von Objekten sind, wurde gezeigt, dass die Zugriffszeit für numerisch indizierte Elemente tatsächlich dieselbe ist wie für assoziative (Text) indizierte Elemente.

2. Die Zugriffszeit für assoziative indizierte Elemente der ersten Ebene steigt nicht an, wenn die Anzahl der tatsächlichen Elemente zunimmt.

In Anbetracht dessen kann es viele Fälle geben, in denen es tatsächlich besser ist, einen verketteten Zeichenfolgenansatz zu verwenden, um die Äquivalenz mehrdimensionaler Elemente zu erstellen. Zum Beispiel:

store['fruit']['apples']['granny']['price] = 10
store['cereal']['natural']['oats']['quack'] = 20

geht zu:

store['fruit.apples.granny.price'] = 10
store['cereal.natural.oats.quack'] = 20

Zu den Vorteilen gehören:

• Sie müssen keine Unterobjekte initialisieren oder herausfinden, wie Objekte am besten kombiniert werden können
• einstufige Zugriffszeit. Objekte innerhalb von Objekten benötigen die N-fache Zugriffszeit
• kann Object.keys () verwenden, um alle Dimensionsinformationen zu extrahieren und ..
• Mit der Funktion regex.test (Zeichenfolge) und der Funktion array.map auf den Tasten können Sie genau das herausziehen, was Sie möchten.
• Keine Hierarchie in den Dimensionen.
• Der "Punkt" ist willkürlich - die Verwendung von Unterstrichen erleichtert die Regex
• Es gibt viele Skripte zum "Reduzieren" von JSON in und aus diesem Format
• kann alle anderen netten Array-Verarbeitungsfunktionen auf der Keylist verwenden

Ruft den Wert für die Eigenschaft eines Arrays assoziativer Arrays ab, wenn der Eigenschaftsname eine Ganzzahl ist:

Beginnend mit einem assoziativen Array, bei dem die Eigenschaftsnamen Ganzzahlen sind:

var categories = [
    {"1":"Category 1"},
    {"2":"Category 2"},
    {"3":"Category 3"},
    {"4":"Category 4"}
];

Elemente in das Array verschieben:

categories.push({"2300": "Category 2300"});
categories.push({"2301": "Category 2301"});

Durchlaufen Sie das Array und machen Sie etwas mit dem Eigenschaftswert.

for (var i = 0; i < categories.length; i++) {
    for (var categoryid in categories[i]) {
        var category = categories[i][categoryid];
        // log progress to the console
        console.log(categoryid + " : " + category);
        //  ... do something
    }
}

Die Konsolenausgabe sollte folgendermaßen aussehen:

1 : Category 1
2 : Category 2
3 : Category 3
4 : Category 4
2300 : Category 2300
2301 : Category 2301

Wie Sie sehen können, können Sie die assoziative Array-Einschränkung umgehen und einen Eigenschaftsnamen als Ganzzahl festlegen.

HINWEIS: Das assoziative Array in meinem Beispiel ist das JSON, das Sie hätten, wenn Sie ein Dictionary [] -Objekt serialisiert hätten.

Verwenden Sie kein Array, sondern ein Objekt.

var foo = new Object();

Sie müssen nicht unbedingt Objekte verwenden, sondern können dies mit normalen mehrdimensionalen Arrays tun.

Dies ist meine Lösung ohne Objekte :

// Javascript
const matrix = [];

matrix.key1 = [
  'value1',
  'value2',
];

matrix.key2 = [
  'value3',
];

was in PHP gleichbedeutend ist mit:

// PHP
$matrix = [
    "key1" => [
        'value1',
        'value2',
    ],
    "key2" => [
        'value3',
    ]
];

    var myObj = [];
    myObj['Base'] = [];
    myObj['Base']['Base.panel.panel_base'] = {ContextParent:'',ClassParent:'',NameParent:'',Context:'Base',Class:'panel',Name:'panel_base',Visible:'',ValueIst:'',ValueSoll:'',
                                              Align:'',  AlignFrom:'',AlignTo:'',Content:'',onClick:'',Style:'',content_ger_sie:'',content_ger_du:'',content_eng:'' };
    myObj['Base']['Base.panel.panel_top']  = {ContextParent:'',ClassParent:'',NameParent:'',Context:'Base',Class:'panel',Name:'panel_base',Visible:'',ValueIst:'',ValueSoll:'',
                                              Align:'',AlignFrom:'',AlignTo:'',Content:'',onClick:'',Style:'',content_ger_sie:'',content_ger_du:'',content_eng:'' };

    myObj['SC1'] = [];
    myObj['SC1']['Base.panel.panel_base'] = {ContextParent:'',ClassParent:'',NameParent:'',Context:'Base',Class:'panel',Name:'panel_base',Visible:'',ValueIst:'',ValueSoll:'',
                                              Align:'',  AlignFrom:'',AlignTo:'',Content:'',onClick:'',Style:'',content_ger_sie:'',content_ger_du:'',content_eng:'' };
    myObj['SC1']['Base.panel.panel_top']  = {ContextParent:'',ClassParent:'',NameParent:'',Context:'Base',Class:'panel',Name:'panel_base',Visible:'',ValueIst:'',ValueSoll:'',
                                              Align:'',AlignFrom:'',AlignTo:'',Content:'',onClick:'',Style:'',content_ger_sie:'',content_ger_du:'',content_eng:'' };


    console.log(myObj);

    if ('Base' in myObj) {
      console.log('Base found');

      if ('Base.panel.panel_base' in myObj['Base'])  {
        console.log('Base.panel.panel_base found'); 


      console.log('old value: ' + myObj['Base']['Base.panel.panel_base'].Context);  
      myObj['Base']['Base.panel.panel_base'] = 'new Value';
      console.log('new value: ' + myObj['Base']['Base.panel.panel_base']);
      }
    }

Ausgabe:

• Basis gefunden
• Base.panel.panel_base gefunden
• alter Wert: Basis
• neuer Wert: neuer Wert

Die Array-Operation funktioniert. Es gibt kein Problem.

Wiederholung:

     Object.keys(myObj['Base']).forEach(function(key, index) {            
        var value = objcons['Base'][key];                   
      }, myObj);