Gibt es eine Möglichkeit, variable Schlüssel in einem JavaScript-Objektliteral zu verwenden?

80

Ich habe solchen Code.

var key = "anything";   
var object = {   
    key: "key attribute"  
};

Ich möchte wissen, ob es eine Möglichkeit gibt, dies durch key"irgendetwas" zu ersetzen .

mögen

var object = {  
    "anything": "key attribute"     
};

javascript

— Gordian Yuan
quelle

192

Verwenden Sie in ES6 berechnete Eigenschaftsnamen .

const key = "anything";   

const object = {   
    [key]: "key attribute"
//  ^^^^^  COMPUTED PROPERTY NAME
};

Beachten Sie die eckigen Klammern key. Sie können tatsächlich jeden Ausdruck in eckigen Klammern angeben, nicht nur eine Variable.

5

funktioniert auch auf Chrom. einfachste und beste Antwort (y)

— Anum Sheraz

1

Das ist in Ordnung für ES6, aber was ist mit älteren Versionen (IE11 stürzt mit dem obigen Code ab)

— Pascalzon

116

Ja. Sie können verwenden:

var key = "anything";
var json = { };
json[key] = "key attribute";

Oder verwenden Sie einfach Ihre zweite Methode, wenn Sie beim Schreiben des Programms die Werte zur Hand haben.

— Tvanfosson
quelle

15

In modernem Javascript (ECMAScript 6) können Sie die Variable mit eckigen Klammern umgeben:

var key = "anything";

var json = {
    [key]: "key attribute"
};

— Jorge Barroso
quelle

12

Dies sollte den Trick tun:

var key = "anything";

var json = {};

json[key] = "key attribute";

— D. Evans
quelle

Aber er möchte dies im Kontext eines Objektliteral tun.

4

Lösung:

var key = "anything";

var json = {};

json[key] = "key attribute";

— Aatif Bandey
quelle

Bitte erläutern Sie Ihre Lösung.

— Martin Zabel

1

@ MartinZabel Es scheint kaum eine Erklärung zu brauchen.

-2

Verschlüsse eignen sich hervorragend dafür.

function keyValue(key){
  return function(value){
    var object = {};
    object[key] = value;
    return object;
  }
}

var key = keyValue(key);
key(value);

— Rick
quelle

Das Schließen ist lediglich der hier verwendete Mechanismus. Das Konzept ist HOF.

1

HOF = Funktionen höherer Ordnung.

— Rick

-2

Kürzlich wurde eine Lösung zum Setzen von Cookies benötigt, die die dynamischen JSON-Schlüsselwerte übergeben. Mit https://github.com/js-cookie/js-cookie#json ist dies problemlos möglich. Wollte jeden ausgewählten Optionswert des Benutzers in einem Cookie speichern, damit er beim Herunterfahren der Registerkarte oder des Browsers nicht verloren geht.

var json = { 
        option_values : {}
    };
    $('option:selected').each(function(index, el) {
        var option = $(this);
        var optionText = option.text();
        var key = 'option_' + index;
        json.option_values[key] = optionText;
        Cookies.set('option_values', json, { expires: 7 } );
    });

Anschließend können Sie jeden Cookie-Schlüsselwert bei jedem Laden der Seite mit abrufen

Cookies.getJSON('option_values');

— Alexey Vorobyov
quelle

-3

Nun, es gibt keinen "direkten" Weg, dies zu tun ...

aber das sollte es tun:

json[key] = json.key;
json.key = undefined;

Es ist ein bisschen schwierig, aber hey, es funktioniert!

— jrharshath
quelle