Wie kann ich einem JavaScript-Objekt ein Schlüssel / Wert-Paar hinzufügen?

1383

Hier ist mein Objektliteral:

var obj = {key1: value1, key2: value2};

Wie kann ich Feld hinzufügen key3mit value3dem Objekt?

James Skidmore
quelle
2
Nun, die ganze Ausgabe von assoziativen Arrays in JS ist seltsam, weil Sie dies tun können ... dreaminginjavascript.wordpress.com/2008/06/27/…
Nosredna
@Nosredna - der Punkt ist, es gibt keine assoziativen Arrays in Javascript. In diesem Artikel fügt er einem Array-Objekt Objekteigenschaften hinzu, die jedoch nicht wirklich Teil des 'Arrays' sind.
UpTheCreek
Gibt es eine Möglichkeit, Schlüssel: Wert-Paare in einem Objektliteral mit zukünftigen ES + -Implementierungen bedingt festzulegen?
Con Antonakos

Antworten:

2253

Es gibt zwei Möglichkeiten , einem Objekt neue Eigenschaften hinzuzufügen :

var obj = {
    key1: value1,
    key2: value2
};

Punktnotation verwenden:

obj.key3 = "value3";

Verwenden der eckigen Klammer:

obj["key3"] = "value3";

Das erste Formular wird verwendet, wenn Sie den Namen der Eigenschaft kennen. Die zweite Form wird verwendet, wenn der Name der Eigenschaft dynamisch bestimmt wird. Wie in diesem Beispiel:

var getProperty = function (propertyName) {
    return obj[propertyName];
};

getProperty("key1");
getProperty("key2");
getProperty("key3");

Ein echtes JavaScript-Array kann wie folgt erstellt werden:

Die Array-Literal-Notation:

var arr = [];

Die Array-Konstruktor-Notation:

var arr = new Array();
Ionuț G. Stan
quelle
4
obj ist ein Objekt. Der Teil zwischen (und einschließlich) den Klammern ist das Objektliteral. obj ist kein Objektliteral.
Nosredna
24
Was ist, wenn der Schlüssel eine Zahl ist? obj.123 = 456 funktioniert nicht. obj [123] = 456 funktioniert allerdings
axel freudiger
10
@axelfreudiger In der Tat muss alles, was syntaktisch kein gültiger Variablenbezeichner ist, mit Klammernotation verwendet werden.
Ionuț G. Stan
1
@ KyleKhalafObject.keys({"b": 1, "c": 3, "a": 2}).sort().forEach(console.log);
Ionuț G. Stan
2
@ JohnSmith Die lengthEigenschaft ist nicht festgelegt, da es sich nicht um ein Array handelt, sondern um ein Objekt / eine Karte / ein Wörterbuch.
Ionuț G. Stan
348

Antwort für das Jahr 2017: Object.assign()

Object.assign (dest, src1, src2, ...) führt Objekte zusammen.

Es überschreibt destmit Eigenschaften und Werten von (wie viele) Quellobjekten auch und gibt dann zurück dest.

Die Object.assign()Methode wird verwendet, um die Werte aller aufzählbaren eigenen Eigenschaften von einem oder mehreren Quellobjekten in ein Zielobjekt zu kopieren. Das Zielobjekt wird zurückgegeben.

Live Beispiel

var obj = {key1: "value1", key2: "value2"};
Object.assign(obj, {key3: "value3"});

document.body.innerHTML = JSON.stringify(obj);

Antwort für das Jahr 2018: Objektverbreitungsoperator {...}

obj = {...obj, ...pair};

Von MDN :

Es kopiert eigene aufzählbare Eigenschaften von einem bereitgestellten Objekt auf ein neues Objekt.

Flaches Klonen (ohne Prototyp) oder Zusammenführen von Objekten ist jetzt mit einer kürzeren Syntax als möglich möglich Object.assign().

Beachten Sie, dass Object.assign()Trigger - Setter während Spread Syntax nicht.

Live Beispiel

Es funktioniert in aktuellem Chrome und aktuellem Firefox. Sie sagen, dass es im aktuellen Edge nicht funktioniert.

var obj = {key1: "value1", key2: "value2"};
var pair = {key3: "value3"};
obj = {...obj, ...pair};

document.body.innerHTML = JSON.stringify(obj);

Antwort Jahr 2019

Objektzuweisungsoperator += :

obj += {key3: "value3"};

Ups ... ich wurde mitgerissen. Der Schmuggel von Informationen aus der Zukunft ist illegal. Ordentlich verdeckt!

7vujy0f0hy
quelle
34
obj + = klingt fantastisch
Mehrdad Shokri
2
PhpStorm empfiehlt die Verwendung constund letstatt varsollten , dass die 2018 so sein?
Jim Smith
@jimsmith: Ich bin mir nicht sicher, warum du das hier sagst. Willst du meine Meinung? Der Vorteil eines Dolmetschers ist die Möglichkeit, alles live in der Konsole zu ändern. Ich mag es nicht, constweil es diesen Vorteil beseitigt. Jedes Mal, wenn ich es benutzte, behinderte es die Entwicklung.
7vujy0f0hy
Wir sind im Jahr 2019. Bedeutet das, dass der Zuweisungsoperator bereits verwendet werden kann, um den Spread-Operator zu ersetzen?
Mr-Programme
2
Ein echter Programmierer wird Spaß daran haben, einem immer stressigen Beruf Erleichterung zu verschaffen. Ihre Year 2019 answer ... Opps ...Portion verdient ein Dankeschön, Sie haben meinen Tag gemacht . Beste Antwort +1
ColinWa
89

Ich habe LoDash / Underscore beim Schreiben größerer Projekte geliebt .

Hinzufügen von obj['key']oder obj.keysind alle solide reine JavaScript-Antworten. Sowohl die LoDash- als auch die Underscore-Bibliothek bieten jedoch viele zusätzliche praktische Funktionen für die Arbeit mit Objekten und Arrays im Allgemeinen.

.push()ist für Arrays , nicht für Objekte .

Je nachdem, wonach Sie suchen, gibt es zwei spezifische Funktionen, die möglicherweise nützlich sind und Funktionen bieten, die dem Gefühl von ähneln arr.push(). Weitere Informationen finden Sie in den Dokumenten. Dort finden Sie einige gute Beispiele.

_.merge (nur Lodash)

Das zweite Objekt überschreibt das Basisobjekt oder fügt es hinzu. undefinedWerte werden nicht kopiert.

var obj = {key1: "value1", key2: "value2"};
var obj2 = {key2:"value4", key3: "value3", key4: undefined};
_.merge(obj, obj2);
console.log(obj);
// → {key1: "value1", key2: "value4", key3: "value3"} 

_.extend / _.assign

Das zweite Objekt überschreibt das Basisobjekt oder fügt es hinzu. undefinedwird kopiert.

var obj = {key1: "value1", key2: "value2"};
var obj2 = {key2:"value4", key3: "value3", key4: undefined};
_.extend(obj, obj2);
console.log(obj);
// → {key1: "value1", key2: "value4", key3: "value3", key4: undefined}

_.defaults

Das zweite Objekt enthält Standardeinstellungen, die dem Basisobjekt hinzugefügt werden, wenn sie nicht vorhanden sind. undefinedWerte werden kopiert, wenn der Schlüssel bereits vorhanden ist.

var obj = {key3: "value3", key5: "value5"};
var obj2 = {key1: "value1", key2:"value2", key3: "valueDefault", key4: "valueDefault", key5: undefined};
_.defaults(obj, obj2);
console.log(obj);
// → {key3: "value3", key5: "value5", key1: "value1", key2: "value2", key4: "valueDefault"}

$ .extend

Darüber hinaus kann es sich lohnen, jQuery.extend zu erwähnen. Es funktioniert ähnlich wie _.merge und ist möglicherweise eine bessere Option, wenn Sie jQuery bereits verwenden.

Das zweite Objekt überschreibt das Basisobjekt oder fügt es hinzu. undefinedWerte werden nicht kopiert.

var obj = {key1: "value1", key2: "value2"};
var obj2 = {key2:"value4", key3: "value3", key4: undefined};
$.extend(obj, obj2); 
console.log(obj);
// → {key1: "value1", key2: "value4", key3: "value3"}

Object.assign ()

Es kann erwähnenswert sein, das Objekt ES6 / ES2015 Object.assign zu erwähnen. Es funktioniert ähnlich wie _.merge und ist möglicherweise die beste Option, wenn Sie bereits eine ES6 / ES2015-Polyfüllung wie Babel verwenden, wenn Sie sich selbst polyfillen möchten .

Das zweite Objekt überschreibt das Basisobjekt oder fügt es hinzu. undefinedwird kopiert.

var obj = {key1: "value1", key2: "value2"};
var obj2 = {key2:"value4", key3: "value3", key4: undefined};
Object.assign(obj, obj2); 
console.log(obj);
// → {key1: "value1", key2: "value4", key3: "value3", key4: undefined}
Sir.Nathan Stassen
quelle
Ich glaube, _.merge ist jetzt _.extend (Ziel, andere)
AD
Ah, Sie haben Recht, _.extendist ein universellerer Alias, da die Unterstrichbibliothek immer noch extendnicht verwendet merge. Ich werde meine Antwort aktualisieren.
Sir.Nathan Stassen
66

Sie können eine dieser Optionen verwenden (vorausgesetzt, key3 ist der akute Schlüssel, den Sie verwenden möchten).

arr[ 'key3' ] = value3;

oder

arr.key3 = value3;

Wenn key3 eine Variable ist, sollten Sie Folgendes tun:

var key3 = 'a_key';
var value3 = 3;
arr[ key3 ] = value3;

Danach arr.a_keywürde das Anfordern den Wert value3eines Literals zurückgeben 3.

Seth
quelle
7
Dies ist kein Array, sondern ein Objekt. JS-Arrays werden nur durch Ganzzahlen indiziert. Versuchen Sie, arr.length zu tun, und es wird 0 zurückgegeben. Weitere Informationen
DevAntoine
Der Link von @ DevAntoine ist nicht zugänglich. Wenn Sie die "Länge" dieses Array-Typs erhalten möchten, verwenden Sie: Object.keys (your_array) .length Weitere Informationen zu diesem Problem finden Sie unter: stackoverflow.com/questions/21356880/array-length-returns-0
Thế Anh Nguyễn
Man könnte auch einfach die Längeneigenschaft des Arrays überschreiben, das sie erstellen. Das Setzen von var myarray ["length"] = numArrayFields löst dieses Problem für mich. Angenommen, Sie verfolgen die Anzahl der Felder, die Sie Ihrem Array irgendwie hinzufügen.
John Smith
30
arr.key3 = value3;

weil dein arr nicht wirklich ein Array ist ... Es ist ein Prototyp-Objekt. Das reale Array wäre:

var arr = [{key1: value1}, {key2: value2}];

aber es ist immer noch nicht richtig. Es sollte eigentlich sein:

var arr = [{key: key1, value: value1}, {key: key2, value: value2}];
Robert Koritnik
quelle
25
var employees = []; 
employees.push({id:100,name:'Yashwant',age:30});
employees.push({id:200,name:'Mahesh',age:35});
Vicky
quelle
22
Dies gilt für Arrays, nicht für Objekte.
Roly
12

Einfach Eigenschaften hinzufügen:

Und wir möchten prop2 : 2diesem Objekt hinzufügen , dies sind die bequemsten Optionen:

  1. Punktoperator: object.prop2 = 2;
  2. eckige Klammern: object['prop2'] = 2;

Welches verwenden wir dann?

Der Punktoperator hat eine sauberere Syntax und sollte als Standard (imo) verwendet werden. Der Punktoperator ist jedoch nicht in der Lage, einem Objekt dynamische Schlüssel hinzuzufügen, was in einigen Fällen sehr nützlich sein kann. Hier ist ein Beispiel:

const obj = {
  prop1: 1
}

const key = Math.random() > 0.5 ? 'key1' : 'key2';

obj[key] = 'this value has a dynamic key';

console.log(obj);

Objekte zusammenführen:

Wenn wir die Eigenschaften von 2 Objekten zusammenführen möchten, sind dies die bequemsten Optionen:

  1. Object.assign(), nimmt ein Zielobjekt als Argument und ein oder mehrere Quellobjekte und führt sie zusammen. Zum Beispiel:

const object1 = {
  a: 1,
  b: 2,
};

const object2 = Object.assign({
  c: 3,
  d: 4
}, object1);

console.log(object2);

  1. Objektverbreitungsoperator ...

const obj = {
  prop1: 1,
  prop2: 2
}

const newObj = {
  ...obj,
  prop3: 3,
  prop4: 4
}

console.log(newObj);

Welches verwenden wir?

  • Die Spread-Syntax ist weniger ausführlich und sollte als Standard-Imo verwendet werden. Vergessen Sie nicht, diese Syntax in eine Syntax umzuwandeln, die von allen Browsern unterstützt wird, da sie relativ neu ist.
  • Object.assign() ist dynamischer, da wir Zugriff auf alle Objekte haben, die als Argumente übergeben werden, und diese bearbeiten können, bevor sie dem neuen Objekt zugewiesen werden.
Willem van der Veen
quelle
1
Oben in Ihrem Beitrag: Dies sind keine geschweiften Klammern, sondern eckige Klammern.
Bram Vanroy
11

Ich weiß, dass es dafür bereits eine akzeptierte Antwort gibt, aber ich dachte, ich würde meine Idee irgendwo dokumentieren. Bitte [Leute] fühlen sich frei, Löcher in diese Idee zu stechen, da ich nicht sicher bin, ob es die beste Lösung ist ... aber ich habe dies erst vor ein paar Minuten zusammengestellt:

Object.prototype.push = function( key, value ){
   this[ key ] = value;
   return this;
}

Sie würden es folgendermaßen nutzen:

var obj = {key1: value1, key2: value2};
obj.push( "key3", "value3" );

Da die Prototypfunktion zurückkehrt this, können Sie die Ketten .pushbis zum Ende Ihrerobj Variablen fortsetzen:obj.push(...).push(...).push(...);

Eine weitere Funktion besteht darin, dass Sie ein Array oder ein anderes Objekt als Wert in den Push-Funktionsargumenten übergeben können. Ein funktionierendes Beispiel finden Sie in meiner Geige: http://jsfiddle.net/7tEme/

sadmicrowave
quelle
Vielleicht ist dies keine gute Lösung, ich bekomme anscheinend Fehler in jquery1.9: TypeError: 'undefined' is not a function (evaluating 'U[a].exec(s)')was seltsam ist, weil es in jsfiddle sogar mit jquery1.9 funktioniert
sadmicrowave
3
Sie sollten Object.prototype nicht erweitern. Dies unterbricht die Funktion "Objekt als Hashtabellen" von JavaScript (und anschließend viele Bibliotheken wie die Google Maps JS-API). Siehe Diskussion: stackoverflow.com/questions/1827458/…
Justin R.
11

Performance

Heute 2020.01.14 führe ich Tests für MacOs HighSierra 10.13.6 unter Chrome v78.0.0, Safari v13.0.4 und Firefox v71.0.0 für ausgewählte Lösungen durch. Ich teile Lösungen in veränderlich (erster Buchstabe M) und unveränderlich (erster Buchstabe I). Ich biete auch einige unveränderliche Lösungen (IB, IC, ID / IE) an, die noch nicht in Antworten auf diese Frage veröffentlicht wurden

Schlussfolgerungen

  • schnellste veränderbare Lösungen sind viel schneller als schnellste unveränderliche (> 10x)
  • Ein klassischer veränderlicher Ansatz wie obj.key3 = "abc"(MA, MB) ist am schnellsten
  • Für unveränderliche Lösungen sind die {...obj, key3:'abc'}und Object.assign(IA, IB) am schnellsten
  • überraschenderweise gibt es unveränderliche Lösungen, die schneller sind als einige veränderbare Lösungen für Chrom (MC-IA) und Safari (MD-IB)

Geben Sie hier die Bildbeschreibung ein

Einzelheiten

In Snippet dort getesteten Lösung presended sind, können Sie Test auf Ihrem Rechner prefrom HIER

Geben Sie hier die Bildbeschreibung ein

Kamil Kiełczewski
quelle
9

Sie können eine Klasse mit der Antwort von @ Ionuț G. Stan erstellen

function obj(){
    obj=new Object();
    this.add=function(key,value){
        obj[""+key+""]=value;
    }
    this.obj=obj
}

Erstellen eines neuen Objekts mit der letzten Klasse:

my_obj=new obj();
my_obj.add('key1', 'value1');
my_obj.add('key2', 'value2');
my_obj.add('key3','value3');

Objekt drucken

console.log(my_obj.obj) // Return {key1: "value1", key2: "value2", key3: "value3"} 

Schlüssel drucken

console.log(my_obj.obj["key3"]) //Return value3

Ich bin ein Neuling in Javascript, Kommentare sind willkommen. Funktioniert bei mir.

Eduen Sarceno
quelle
7

Zwei am häufigsten verwendete Methoden, die bereits in den meisten Antworten erwähnt wurden

obj.key3 = "value3";

obj["key3"] = "value3";

Eine weitere Möglichkeit, eine Eigenschaft zu definieren, ist die Verwendung von Object.defineProperty ()

Object.defineProperty(obj, 'key3', {
  value: "value3",       // undefined by default
  enumerable: true,      // false by default
  configurable: true,    // false by default
  writable: true         // false by default
});

Diese Methode ist nützlich, wenn Sie beim Definieren von Eigenschaften mehr Kontrolle haben möchten. Die definierte Eigenschaft kann vom Benutzer als aufzählbar, konfigurierbar und beschreibbar festgelegt werden.

Sanchay Kumar
quelle
6

Ihr Beispiel zeigt ein Objekt, kein Array. In diesem Fall besteht die bevorzugte Möglichkeit, einem Objekt ein Feld hinzuzufügen, darin, es einfach wie folgt zuzuweisen:

arr.key3 = value3;
bdukes
quelle
6

Wird von den meisten Browsern unterstützt und prüft, ob ein Objektschlüssel verfügbar ist oder nicht, den Sie hinzufügen möchten. Wenn verfügbar , überschreibt er den vorhandenen Schlüsselwert und ist nicht verfügbar. Es wird ein Schlüssel mit Wert hinzugefügt

Beispiel 1

let my_object = {};

// now i want to add something in it  

my_object.red = "this is red color";

// { red : "this is red color"}

Beispiel 2

let my_object = { inside_object : { car : "maruti" }}

// now i want to add something inside object of my object 

my_object.inside_object.plane = "JetKing";

// { inside_object : { car : "maruti" , plane : "JetKing"} }

Beispiel 3

let my_object = { inside_object : { name : "abhishek" }}

// now i want to add something inside object with new keys birth , gender 

my_object.inside_object.birth = "8 Aug";
my_object.inside_object.gender = "Male";


    // { inside_object : 
//             { name : "abhishek",
//               birth : "8 Aug",
//               gender : "Male" 
//            }   
//       }
Abhishek Garg
quelle
5

Wenn Sie mehrere anonyme Objektliterale in einem Objekt haben und ein weiteres Objekt mit Schlüssel / Wert-Paaren hinzufügen möchten, gehen Sie folgendermaßen vor:

Firebug 'das Objekt:

console.log(Comicbook);

kehrt zurück:

[Objekt {Name = "Spiderman", Wert = "11"}, Objekt {Name = "Marsipulami", Wert = "18"}, Objekt {Name = "Garfield", Wert = "2"}]

Code:

if (typeof Comicbook[3]=='undefined') {
    private_formArray[3] = new Object();
    private_formArray[3]["name"] = "Peanuts";
    private_formArray[3]["value"] = "12";
}

wird Object {name="Peanuts", value="12"}dem Comicbook-Objekt hinzugefügt

stevek
quelle
schön und klar erklärt andere Option, die besser geeignet ist, Objekte mit einer ID oder Namenseigenschaft zu adressieren, als sie beim Hinzufügen zuzuweisen, gute. Besonders wenn es mehr Requisiten hat oder haben könnte, wird dieselbe Methode angewendet. Setzen Sie einfach ein weiteres Koma und es ist bereit für Planänderungen
Avia Afer
5

Entweder obj['key3'] = value3oder obj.key3 = value3wird das neue Paar zum hinzufügenobj .

Ich weiß jedoch, dass jQuery nicht erwähnt wurde, aber wenn Sie es verwenden, können Sie das Objekt durch hinzufügen $.extend(obj,{key3: 'value3'}). Z.B:

var obj = {key1: 'value1', key2: 'value2'};
$('#ini').append(JSON.stringify(obj));

$.extend(obj,{key3: 'value3'});

$('#ext').append(JSON.stringify(obj));
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p id="ini">Initial: </p>
<p id="ext">Extended: </p>

jQuery. verlängern (Ziel [, Objekt1] [, ObjektN]) den Inhalt von zwei oder mehr Objekten zusammen zum ersten Objekt.

Außerdem können rekursive Ergänzungen / Änderungen vorgenommen werden mit $.extend(true,object1,object2);:

Armfuß
quelle
5

Ein kurzer und eleganter Weg in der nächsten Javascript-Spezifikation (Kandidatenstufe 3) ist:

obj = { ... obj, ... { key3 : value3 } }

Eine ausführlichere Diskussion finden Sie in Object Spread vs Object.assign und auf der Website von Dr. Axel Rauschmayers .

Es funktioniert bereits in node.js seit Release 8.6.0.

Vivaldi, Chrome, Opera und Firefox in aktuellen Versionen kennen diese Funktion ebenfalls, Mirosoft jedoch bis heute weder im Internet Explorer noch in Edge.

xyxyber
quelle
5
var arrOfObj = [{name: 'eve'},{name:'john'},{name:'jane'}];
    var injectObj = {isActive:true, timestamp:new Date()};

    // function to inject key values in all object of json array

    function injectKeyValueInArray (array, keyValues){
        return new Promise((resolve, reject) => {
            if (!array.length)
                return resolve(array);

            array.forEach((object) => {
                for (let key in keyValues) {
                    object[key] = keyValues[key]
                }
            });
            resolve(array);
        })
    };

//call function to inject json key value in all array object
    injectKeyValueInArray(arrOfObj,injectObj).then((newArrOfObj)=>{
        console.log(newArrOfObj);
    });

Ausgabe wie folgt: -

[ { name: 'eve',
    isActive: true,
    timestamp: 2017-12-16T16:03:53.083Z },
  { name: 'john',
    isActive: true,
    timestamp: 2017-12-16T16:03:53.083Z },
  { name: 'jane',
    isActive: true,
    timestamp: 2017-12-16T16:03:53.083Z } ]
Sagte Tauseef Haider Naqvi
quelle
4

Sie können es entweder folgendermaßen hinzufügen:

arr['key3'] = value3;

oder so:

arr.key3 = value3;

Die Antworten, die vorschlagen, mit der Variablen in das Objekt einzugeben key3, funktionieren nur, wenn der Wert von key3war 'key3'.

Wombleton
quelle
4

Gemäß den in ECMA-262 ( http://www.ecma-international.org/publications/files/ECMA-ST/Ecma-262.pdf) definierten Property Accessors , P67) gibt es zwei Möglichkeiten, Eigenschaften hinzuzufügen ein existierendes Objekt. Alle diese beiden Möglichkeiten werden von der Javascript-Engine gleich behandelt.

Der erste Weg ist die Verwendung der Punktnotation:

obj.key3 = value3;

Auf diese Weise sollten Sie nach der Punktnotation einen IdentifierName verwenden.

Die zweite Möglichkeit ist die Verwendung der Klammernotation:

obj["key3"] = value3;

und eine andere Form:

var key3 = "key3";
obj[key3] = value3;

Auf diese Weise können Sie einen Ausdruck (einschließlich IdentifierName ) in der Klammernotation verwenden.

Chen Yang
quelle
4

Das können wir auch so machen.

var myMap = new Map();
myMap.set(0, 'my value1');
myMap.set(1, 'my value2');
 for (var [key, value] of myMap) {
  console.log(key + ' = ' + value);
 }
Miraj Hamid
quelle
1

Da ist es eine Frage der Vergangenheit, aber das Problem der Gegenwart. Würde eine weitere Lösung vorschlagen: Übergeben Sie einfach den Schlüssel und die Werte an die Funktion und Sie erhalten ein Kartenobjekt.

var map = {};
function addValueToMap(key, value) {
map[key] = map[key] || [];
map[key].push(value);
}
PPing
quelle
2
Dies scheint nichts mit der Frage zu tun zu haben, die überhaupt gestellt wurde.
Quentin
0

Um einem Objekt ein Schlüssel-Wert-Paar voranzustellen, damit das for in mit diesem Element funktioniert, gehen Sie zunächst folgendermaßen vor:

    var nwrow = {'newkey': 'value' };
    for(var column in row){
        nwrow[column] = row[column];
    }
    row = nwrow;
relipse
quelle
0

Der beste Weg, dies zu erreichen, ist unten angegeben:

function getKey(key) {
  return `${key}`;
}

var obj = {key1: "value1", key2: "value2", [getKey('key3')]: "value3"};

//console.log(obj);
Sgajera
quelle
0

Sie können ein neues Objekt mithilfe der folgenden {[key]: value}Syntax erstellen :

const foo = {
  a: 'key',
  b: 'value'
}

const bar = {
  [foo.a]: foo.b
}

console.log(bar); // {key: 'value'}
console.log(bar.key); // value

const baz = {
  ['key2']: 'value2'
}

console.log(baz); // {key2: 'value2'}
console.log(baz.key2); // value2

Mit der vorherigen Syntax können Sie jetzt die Spread-Syntax verwenden {...foo, ...bar}, um ein neues Objekt hinzuzufügen, ohne Ihren alten Wert zu ändern:

const foo = {a: 1, b: 2};

const bar = {...foo, ...{['c']: 3}};

console.log(bar); // {a: 1, b: 2, c: 3}
console.log(bar.c); // 3

Jonathan Stellwag
quelle