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

Question

Hier ist mein wörtliches Objekt:

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

Wie kann ich ein Feld hinzufügen? key3 avec value3 zum Objekt?

Answer 1

Die von den meisten Browsern unterstützt wird, und prüft, ob ein Objektschlüssel vorhanden ist oder nicht, den Sie hinzufügen möchten. verfügbar es überschreibt bestehenden Schlüsselwert und es nicht verfügbar es Schlüssel mit Wert hinzufügen

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" 
//            }   
//       }

Answer 2

Selon Eigenschaft Accessors definiert in ECMA-262( http://www.ecma-international.org/publications/files/ECMA-ST/Ecma-262.pdf , P67), gibt es zwei Möglichkeiten, einem bestehenden Objekt Eigenschaften hinzuzufügen. Alle diese beiden Möglichkeiten werden von der Javascript-Engine gleich behandelt.

Die erste Möglichkeit ist die Verwendung der Punktnotation:

obj.key3 = value3;

Aber auf diese Weise sollten Sie eine BezeichnerName nach der Punktnotation.

Die zweite Möglichkeit ist die Verwendung der Klammerschreibweise:

obj["key3"] = value3;

und eine andere Form:

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

Auf diese Weise könnten Sie eine Ausdruck (enthalten BezeichnerName ) in der Klammerschreibweise.

Answer 3

Entweder obj['key3'] = value3 o obj.key3 = value3 fügt das neue Paar zu den obj .

Ich weiß jedoch, dass jQuery nicht erwähnt wurde, aber wenn Sie es verwenden, können Sie das Objekt über $.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. erweitern. (Ziel[,Objekt1][,ObjektN]) fügt den Inhalt von zwei oder mehr Objekten zum ersten Objekt zusammen.

Und es erlaubt auch rekursive Hinzufügungen/Änderungen mit $.extend(true,object1,object2); :

var object1 = {
  apple: 0,
  banana: { weight: 52, price: 100 },
  cherry: 97
};
var object2 = {
  banana: { price: 200 },
  durian: 100
};
$("#ini").append(JSON.stringify(object1));    

$.extend( true, object1, object2 );

$("#ext").append(JSON.stringify(object1));

<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>

Answer 4

Denn es ist eine Frage der Vergangenheit, aber das Problem der Gegenwart. Ich würde eine weitere Lösung vorschlagen: Übergeben Sie einfach den Schlüssel und die Werte an die Funktion und Sie erhalten ein Map-Objekt.

var map = {};
function addValueToMap(key, value) {
map[key] = map[key] || [];
map[key].push(value);
}

Answer 5

Der beste Weg, dies zu erreichen, ist der folgende:

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

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

//console.log(obj);