So legen Sie einen JS-Objekteigenschaftsnamen aus einer Variablen fest

177

Ich muss einen JS-Objekteigenschaftsnamen dynamisch festlegen.

for(i=1; i<3; i++) {
    var key  = i+'name';

    data = {
        key : 'name1',
    }
}

Ergebnis sollte sein:

data = {
    1name: 'name1'
    2name: 'name1'
}

javascript

— Vinoth Babu
quelle

Wenn sie sequentiell sind, warum verwenden Sie kein Array?

— Epascarello

Ich möchte wissen, welche drei von Ihnen den falschen Pfeil getroffen haben. Komm schon, mach schon.

— Charles

1

Mögliches Duplikat der Verwendung einer Variablen für einen Schlüssel in einem JavaScript-Objektliteral

— halfer

193

var jsonVariable = {};
for(var i=1; i < 3; i++) {
  jsonVariable[i + 'name'] = 'name' + i;        
}

— Schließung
quelle

4

Musas Antwort unten artikuliert auch richtig, dass die Verwendung der [] Notation tatsächlich der einzige Weg ist, dies zu tun.

— Dennis Plucinik

1

Beachten Sie auch, dass @ ChilNuts Antwort unten jetzt den einfachsten Weg beschreibt, dies mit ES6 zu tun

— Rambossa

1

Tatsächlich wird mit der neuen Syntax das, was OP erreichen will, nur möglich sein, wenn das Schleifenlimit fest codiert und klein ist.

— Musa

166

Sie müssen die []Notation verwenden, um Schlüssel dynamisch festzulegen.

var jsonVariable = {};
for(i=1; i<3; i++) {        
 var jsonKey  = i+'name';
 jsonVariable[jsonKey] = 'name1';

}

In ES6 können Sie jetzt die Objektliteral-Syntax verwenden, um Objektschlüssel dynamisch zu erstellen. Fügen Sie einfach die Variable ein []

var key  = i + 'name';
data = {
    [key] : 'name1',
}

— Musa
quelle

3

jsonVariable = {}; sollte nicht innerhalb der for-Schleife initialisiert werden.

— Schließung

Auch Sie machen jsonVariable hier global

— Dennis Plucinik

129

Mit ECMAScript 6 können Sie variable Eigenschaftsnamen mit der Objektliteral-Syntax wie folgt verwenden:

var keyName = 'myKey';
var obj = {
              [keyName]: 1
          };
obj.myKey;//1

Diese Syntax ist in den folgenden neueren Browsern verfügbar:

Edge 12+ (keine IE-Unterstützung), FF34 +, Chrome 44+, Opera 31+, Safari 7.1+

( https://kangax.github.io/compat-table/es6/ )

Sie können älteren Browsern Unterstützung hinzufügen, indem Sie einen Transpiler wie babel verwenden . Es ist einfach, ein gesamtes Projekt zu transpilieren, wenn Sie einen Modulbündler wie Rollup oder Webpack verwenden .

— chiliNUT
quelle

2

Vielen Dank für das Hinzufügen der fantastischen ES6-Syntax

— Rambossa

Ohne ES6 kann ich var payload = {dynamicKey: val} nicht definieren. Ich muss var payload = {} und payload [variableName] = val ausführen.

— Sainath SR

23

Auf diese Weise können Sie den Wert dynamisch einstellen

var jsonVariable = {};
for (var i = 1; i < 3; i++) {
    var jsonKey = i + 'name';
    jsonVariable[jsonKey] = 'name' + i;
}

— timc
quelle

20

Verwenden Sie eine Variable als Objektschlüssel

let key = 'myKey';

let data = {[key] : 'name1'; }

Hier erfahren Sie, wie Sie Ihr Objekt iterieren

— Boris Detry
quelle

Können Sie bitte etwas näher darauf eingehen, um anderen mitzuteilen, warum dies eine Lösung sein könnte?

— Phaberest

Die Informationen, die Sie hinzugefügt haben, sind in Ordnung, geben Sie nur niemals eine Antwort mit nur Code;)

— Phaberest

7

Es spielt keine Rolle, woher die Variable kommt. Hauptsache wir haben eins ... Setzen Sie den Variablennamen in eckige Klammern "[..]".

var optionName = 'nameA';
var JsonVar = {
[optionName] : 'some value'
}

— Knut Hering
quelle

Das funktioniert gut, ich frage mich, ob es in allen Browsern / Versionen funktioniert

— Mercury

1

jsonVariable = {}
for(i=1; i<3; i++) {        
   var jsonKey  = i+'name';
   jsonVariable[jsonKey] = 'name1'
}

Dies wird ähnlich sein wie

    jsonVariable = {
    1name : 'name1'
    2name : 'name1'
}

— Suman
quelle

0

In Anlehnung an den obigen Kommentar von Sainath SR konnte ich einen js-Objekteigenschaftsnamen aus einer Variablen in Google Apps Script (die ES6 noch nicht unterstützt) festlegen, indem ich das Objekt definierte und dann einen anderen Schlüssel / Wert außerhalb des Objekts definierte:

var salesperson = ...

var mailchimpInterests = { 
        "aGroupId": true,
    };

mailchimpInterests[salesperson] = true;

— Mark Corrigan
quelle