Dynamisch access-Objekt-Eigenschaft mit der Variablen

Ich versuche, auf eine Eigenschaft eines Objekts unter Verwendung eines dynamischen Namen. Ist das möglich?

const something = { bar: "Foobar!" };
const foo = 'bar';
something.foo; //The idea is to access something.bar, getting "Foobar!"

Siehe auch - Eigenschaft Zugriff: dot-notation vs. Klammern? und Wie füge ich eine Eigenschaft an ein Objekt mit einer variable wie der name?

InformationsquelleAutor RichW | 2010-11-22

779

Gibt es zwei Möglichkeiten zum Zugriff auf Eigenschaften eines Objekts:
- Dot-notation: something.bar
- Klammer-notation: something['bar']
Den Wert zwischen den Klammern kann ein beliebiger Ausdruck. Daher, wenn der name der Eigenschaft in einer Variablen gespeichert ist, verwenden Sie die Klammer-notation:
```
var foo = 'bar';
something[foo];
//both x = something[foo] and something[foo] = x work as expected
```
seien Sie vorsichtig mit dieser: javascript-Compiler-Fehler, da Sie nicht umbenennen Saiten, aber Sie tun Objekt umbenennen Eigenschaften
Ein paar mehr Infos, warum dies möglich ist: JS-Objekte sind assoziative arrays, das ist, warum. Weiter Lesen: quirksmode.org/js/associative.html stackoverflow.com/questions/14031368/...
Nein, Sie sind nicht. Arrays sind Objekte, die Erben aus der Ebene JS-Objekt-Prototyp und daher Sie können die Eigenschaften einer go-go-wie jedes Ebene Objekt. Der 'assoziativ' - Verhalten ist mehr Objekt als array wie. Sie können nicht die Iteration der 'assoziativ' - version von einfachen index so ist es nicht die Anzeige von array-ähnliches Verhalten. Sie definieren Ihre 'assoziative' array als {} oder [], und behandeln Sie das gleiche in beiden Fällen, soweit die zufällige Eigenschaft Zugriff betroffen ist.
Nicht sicher, was Ihren Einwand betrifft? Ich habe nicht gesagt, dass JS-Objekte sind arrays?
als ein Hinweis auf die richtige Antwort , Verweis

InformationsquelleAutor Jan Hančič

Dies ist meine Lösung:

function resolve(path, obj) {
    return path.split('.').reduce(function(prev, curr) {
        return prev ? prev[curr] : null
    }, obj || self)
}

Beispiele:

resolve("document.body.style.width")
//or
resolve("style.width", document.body)
//or even use array indexes
//(someObject has been defined in the question)
resolve("part.0.size", someObject) 
//returns null when intermediate properties are not defined:
resolve('properties.that.do.not.exist', {hello:'world'})

Dies ist ähnlich wie das lodash bekommen
Ausgezeichnete Antwort, siehe auch: stackoverflow.com/questions/37510640/...
Sie hat mich inspiriert, erstellen Sie eine erweiterte version, mit der bracket-Schreibweise & property-Namen, der Leerzeichen sowie die Validierung der Eingaben: es.knightnet.org.uk/kb/node-js/get-Eigenschaften

InformationsquelleAutor abahet

32

In javascript können wir auf mit:
- dot-notation - foo.bar
- eckigen Klammern - foo[someVar] oder foo["string"]
Aber nur der zweite Fall ermöglicht den Zugriff auf Eigenschaften dynamisch:
```
var foo = { pName1 : 1, pName2 : [1, {foo : bar }, 3] , ...}

var name = "pName"
var num  = 1;

foo[name + num]; //1

//-- 

var a = 2;
var b = 1;
var c = "foo";

foo[name + a][b][c]; //bar
```
Ich bin starrte auf 2.000 Zeilen von if-Anweisungen, weil der Vorherige dev nicht mit den eckigen Klammern und statisch zugegriffen Objekt-Eigenschaften, indem Sie die Punkt-notation. Es ist für einen Genehmigungsprozess app verfügt über 7 verschiedene genehmigende und die Schritte sind alle gleich. /rip

InformationsquelleAutor Sonique

Folgenden ist ein ES6 Beispiel, wie Sie den Zugriff auf die Eigenschaft eines Objekt mit einer name-Eigenschaft wurde dynamisch generiert durch Verkettung von zwei Zeichenfolgen.

var suffix = " name";

var person = {
    ["first" + suffix]: "Nicholas",
    ["last" + suffix]: "Zakas"
};

console.log(person["first name"]);      //"Nicholas"
console.log(person["last name"]);       //"Zakas"

Dies wird als berechnete Eigenschaftsnamen

InformationsquelleAutor zloctb

Können Sie dies erreichen durchaus ein paar verschiedene Möglichkeiten.

let foo = {
    bar: 'Hello World'
};

foo.bar;
foo['bar'];

Die Klammer-notation ist besonders kraftvoll, da es lässt Sie Zugriff auf eine Eigenschaft basierend auf einer Variablen:

let foo = {
    bar: 'Hello World'
};

let prop = 'bar';

foo[prop];

Verlängert werden kann, um Schleifen über jede Eigenschaft eines Objekts. Dies kann redundant durch neuere JavaScript-Konstrukte wie for......, aber hilft bei der Veranschaulichung eines use-case:

let foo = {
    bar: 'Hello World',
    baz: 'How are you doing?',
    last: 'Quite alright'
};

for (let prop in foo.getOwnPropertyNames()) {
    console.log(foo[prop]);
}

Beide Punkt-und-Klammer-notation auch wie erwartet funktionieren verschachtelte Objekte:

let foo = {
    bar: {
        baz: 'Hello World'
    }
};

foo.bar.baz;
foo['bar']['baz'];
foo.bar['baz'];
foo['bar'].baz;

Objekt destructuring

Könnten wir auch überlegen, Objekt destructuring als Mittel zum Zugriff auf eine Eigenschaft in einem Objekt, sondern wie folgt:

let foo = {
    bar: 'Hello World',
    baz: 'How are you doing?',
    last: 'Quite alright'
};

let prop = 'last';
let { bar, baz, [prop]: customName } = foo;

//bar = 'Hello World'
//baz = 'How are you doing?'
//customName = 'Quite alright'

InformationsquelleAutor Gorka Hernandez

8

AKTUALISIERT

Habe ich die Kommentare unten berücksichtigt und vereinbart. Eval ist zu vermeiden.

Root-Zugriff die Eigenschaften im Objekt ist leicht zu erreichen mit obj[variable], aber immer geschachtelte erschwert die Sache. Nicht zu schreiben, bereits geschriebenen code, schlage ich lodash.get.

Beispiel
```
//Accessing root property
var rootProp = 'rootPropert';
_.get(object, rootProp, defaultValue);

//Accessing nested property
var listOfNestedProperties = [var1, var2];
_.get(object, listOfNestedProperties);
```
Lodash Holen kann verwendet werden, auf verschiedene weisen, hier ist der link zu der Dokumentation lodash.erhalten

Es ist am besten zu vermeiden, mit eval Wann immer möglich. stackoverflow.com/questions/86513/...
Mit eval für so etwas triviales wie der Zugriff auf Eigenschaften ist schlicht overkill und kaum ratsam, unter allen Umständen. Was sind "Schwierigkeiten"? obj['nested']['test'] funktioniert sehr gut und erfordert nicht die embed-code in strings.
eval ist drei mal langsamer sind oder mehr, ich würde nicht empfehlen dies für Neulinge, weil es könnte Sie lehren, schlechten Gewohnheiten. Ich benutze obj['nested']['value'] - denken Sie daran, Kinder, eval ist evil!
Er ist jetzt der einzige bringen wollen, Lodash _.get auf den Tisch. Ich denke, diese Antwort verdient jetzt upvotes anstatt downvotes. Es kann overkill, aber es ist gut zu wissen, dass es existiert.
Vielen Dank für die Einführung von lodash. Ich kam hier durch google auf der Suche nach einer Methode um einen Wert Tiefe in einem Objekt und verwendet Ihre _.set-Methode (die ist identisch zu oben, aber mit dem zusätzlichen argument für den Wert zu setzen).

InformationsquelleAutor Mr Br
8

Können Sie es tun, wie dies mit Lodash bekommen
```
_.get(object, 'a[0].b.c');
```
InformationsquelleAutor shalonteoh

Wird es interessant, wenn man Parameter übergeben, um diese Funktion auch.

Code jsfiddle

var obj = {method:function(p1,p2,p3){console.log("method:",arguments)}}

var str = "method('p1', 'p2', 'p3');"

var match = str.match(/^\s*(\S+)\((.*)\);\s*$/);

var func = match[1]
var parameters = match[2].split(',');
for(var i = 0; i < parameters.length; ++i) {
  //clean up param begninning
    parameters[i] = parameters[i].replace(/^\s*['"]?/,'');
  //clean up param end
  parameters[i] = parameters[i].replace(/['"]?\s*$/,'');
}

obj[func](parameters); //sends parameters as array
obj[func].apply(this, parameters); //sends parameters as individual values

InformationsquelleAutor Jacksonkr

-2

Sollten Sie verwenden JSON.parse, werfen Sie einen Blick auf https://www.w3schools.com/js/js_json_parse.asp
```
const obj = JSON.parse('{ "name":"John", "age":30, "city":"New York"}')
console.log(obj.name)
console.log(obj.age)
```
InformationsquelleAutor onmyway133
-3
```
const something = { bar: "Foobar!" };
const foo = 'bar';

something[\`${foo}\`];
```
Warum auf der Erde würden Sie das tun? Ihre foo ist bereits ein string, so `${foo}` ist genau das gleiche wie foo. (Auch, Ihren code zu haben scheint einige zusätzliche Schrägstriche, die dort nicht hingehört. Aber es wäre doch sinnlos, auch wenn Sie Feste syntax Fehler.)

InformationsquelleAutor Sergey

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.

AKTUALISIERT