Ich versuche, mit einem dynamischen Namen auf eine Eigenschaft eines Objekts zuzugreifen. Ist das möglich?
const something = { bar: "Foobar!" };
const foo = 'bar';
something.foo; // The idea is to access something.bar, getting "Foobar!"
javascript
object
properties
RichW
quelle
quelle
Antworten:
Es gibt zwei Möglichkeiten, auf Eigenschaften eines Objekts zuzugreifen :
something.bar
something['bar']
Der Wert zwischen den Klammern kann ein beliebiger Ausdruck sein. Wenn der Eigenschaftsname in einer Variablen gespeichert ist, müssen Sie daher die Klammernotation verwenden:
quelle
Das ist meine Lösung:
Anwendungsbeispiele:
quelle
In Javascript können wir zugreifen mit:
foo.bar
foo[someVar]
oderfoo["string"]
Der zweite Fall ermöglicht jedoch den dynamischen Zugriff auf Eigenschaften:
quelle
Im Folgenden finden Sie ein ES6-Beispiel dafür, wie Sie mit einem Eigenschaftsnamen, der durch Verketten von zwei Zeichenfolgen dynamisch generiert wurde, auf die Eigenschaft eines Objekts zugreifen können.
Dies wird als berechnete Eigenschaftsnamen bezeichnet
quelle
Sie können dies auf verschiedene Arten erreichen.
Die Klammernotation ist besonders leistungsfähig, da Sie auf eine Eigenschaft zugreifen können, die auf einer Variablen basiert:
Dies kann erweitert werden, um jede Eigenschaft eines Objekts zu durchlaufen. Dies kann aufgrund neuerer JavaScript-Konstrukte wie ... von ... überflüssig erscheinen, hilft jedoch bei der Veranschaulichung eines Anwendungsfalls:
Sowohl die Punkt- als auch die Klammernotation funktionieren erwartungsgemäß auch für verschachtelte Objekte:
Objektzerstörung
Wir könnten die Objektzerstörung auch als Mittel betrachten, um auf eine Eigenschaft in einem Objekt zuzugreifen, aber wie folgt:
quelle
Sie können es so mit Lodash get machen
quelle
AKTUALISIERT
Ich habe die folgenden Kommentare berücksichtigt und bin damit einverstanden. Eval ist zu vermeiden.
Der Zugriff auf Root-Eigenschaften in einem Objekt ist leicht zu erreichen
obj[variable]
, aber das Verschachteln erschwert die Sache. Um nicht bereits geschriebenen Code zu schreiben, schlage ich vor, ihn zu verwendenlodash.get
.Beispiel
Lodash get kann auf verschiedene Arten verwendet werden. Hier finden Sie einen Link zur Dokumentation lodash.get
quelle
eval
wenn immer möglich. stackoverflow.com/questions/86513/…eval
für etwas so Triviales wie den Zugriff auf Immobilien ist einfach übertrieben und unter keinen Umständen ratsam. Was ist "Ärger"?obj['nested']['test']
funktioniert sehr gut und erfordert nicht, dass Sie Code in Zeichenfolgen einbetten.obj['nested']['value']
- erinnere dich an Kinder, Eval ist böse!_.get
an den Tisch bringen möchte . Ich denke, diese Antwort verdient jetzt positive Stimmen statt negative Stimmen. Es mag übertrieben sein, aber es ist gut zu wissen, dass es existiert.Wann immer Sie dynamisch auf Eigenschaften zugreifen müssen, müssen Sie eine eckige Klammer verwenden, um auf Eigenschaften zuzugreifen, nicht auf "." Operator
Syntax: Objekt [Eigenschaft}
quelle
Ich bin auf einen Fall gestoßen, in dem ich dachte, ich möchte die "Adresse" einer Objekteigenschaft als Daten an eine andere Funktion übergeben und das Objekt (mit AJAX) füllen, vom Adressarray nachschlagen und in dieser anderen Funktion anzeigen. Ich konnte die Punktnotation nicht verwenden, ohne String-Akrobatik zu betreiben, daher dachte ich, ein Array könnte stattdessen gut übergeben werden. Am Ende habe ich sowieso etwas anderes gemacht, schien aber mit diesem Beitrag verwandt zu sein.
Hier ist ein Beispiel eines Sprachdateiobjekts wie das, von dem ich Daten haben wollte:
Ich wollte in der Lage sein, ein Array wie das folgende zu übergeben: ["audioPlayer", "control", "stop"], um auf den Sprachtext zuzugreifen, in diesem Fall "stop".
Ich habe diese kleine Funktion erstellt, die den "am wenigsten spezifischen" (ersten) Adressparameter nachschlägt und das zurückgegebene Objekt sich selbst neu zuweist. Dann ist es bereit, den nächstspezifischeren Adressparameter nachzuschlagen, falls einer vorhanden ist.
Verwendungszweck:
quelle
Es wird interessant, wenn Sie auch Parameter an diese Funktion übergeben müssen.
Code jsfiddle
quelle
ES5 // Tief verschachtelte Variablen prüfen
Dieser einfache Code kann nach tief verschachtelten Variablen / Werten suchen, ohne dass jede Variable auf dem Weg überprüft werden muss ...
Ex. - eine tief verschachtelte Reihe von Objekten:
Anstatt von :
Wir können jetzt:
Prost!
quelle
Function
stattdessen zu verwendenIch habe vor einiger Zeit eine Frage zu diesem Thema gestellt, und nach übermäßiger Recherche und dem Fehlen vieler Informationen, die hier sein sollten, habe ich das Gefühl, dass ich diesem älteren Beitrag etwas Wertvolles hinzufügen kann.
Ich gehe diesen Weg jedoch selten, da er bei Eigenschaftswerten, die über Stylesheets zugewiesen wurden, nicht funktioniert. Um Ihnen ein Beispiel zu geben, werde ich mit ein bisschen Pseudocode demonstrieren.
Verwenden Sie das obige Codebeispiel. Wenn die width-Eigenschaft des div-Elements, das in der Variablen 'elem' gespeichert wurde, in einem CSS-Stylesheet und nicht in seinem HTML-Tag gestaltet wurde, erhalten Sie ohne Zweifel den Rückgabewert undefined, der darin gespeichert ist der Variablen cssProp. Der undefinierte Wert tritt auf, weil der in ein CSS-Stylesheet geschriebene Code berechnet werden muss, um den Wert zu erhalten, um den richtigen Wert zu erhalten. Sie müssen eine Methode verwenden, die den Wert der Eigenschaft berechnet, deren Wert im Stylesheet liegt.
W3Schools getComputedValue Doc Dies ist ein gutes Beispiel, mit dem Sie spielen können. Dieser Link Mozilla CSS getComputedValue doc beschreibt jedoch ausführlich die Funktion getComputedValue und sollte von jedem aufstrebenden Entwickler gelesen werden, der sich mit diesem Thema nicht ganz auskennt.
... bekommt und setzt. Es ist das, was ich benutze. Der einzige Nachteil ist, dass Sie JQuery kennengelernt haben, aber dies ist ehrlich gesagt einer der vielen guten Gründe, warum jeder Javascript-Entwickler JQuery lernen sollte. Es macht das Leben einfach und bietet Methoden wie diese ist mit Standard-Javascript nicht verfügbar. Hoffe das hilft jemandem !!!
quelle
Für alle, die den Wert einer verschachtelten Variablen festlegen möchten, gehen Sie wie folgt vor:
Dokumentation: https://lodash.com/docs/4.17.15#set
Außerdem Dokumentation, wenn Sie einen Wert erhalten möchten: https://lodash.com/docs/4.17.15#get
quelle
Sie sollten verwenden
JSON.parse
, werfen Sie einen Blick auf https://www.w3schools.com/js/js_json_parse.aspquelle
quelle
foo
ist bereits eine Zeichenfolge,`${foo}`
ist also genau das gleiche wiefoo
. (Außerdem scheint Ihr Code einige zusätzliche Backslashes zu haben, die nicht dorthin gehören. Aber es wäre immer noch sinnlos, selbst wenn Sie diesen Syntaxfehler behoben hätten.)