Hinzufügen einer Eigenschaft zu einem JavaScript-Objekt unter Verwendung einer Variablen als Name?

Ich ziehe mit jQuery Elemente aus dem DOM heraus und möchte mithilfe iddes DOM-Elements eine Eigenschaft für ein Objekt festlegen .

Beispiel

const obj = {}

jQuery(itemsFromDom).each(function() {
  const element = jQuery(this)
  const name = element.attr('id')
  const value = element.attr('value')

  // Here is the problem
  obj.name = value
})

Wenn itemsFromDomein Element mit einer id"myId" enthalten ist, möchte objich eine Eigenschaft mit dem Namen "myId" haben. Das obige gibt mirname .

Wie benenne ich eine Eigenschaft eines Objekts mithilfe einer Variablen mithilfe von JavaScript?

Sie können diese äquivalente Syntax verwenden:

obj[name] = value

Mit ECMAScript 2015 können Sie dies direkt in der Objektdeklaration in Klammernotation tun:

var obj = {
  [key]: value
}

Wo keykann eine beliebige Art von Ausdruck (z. B. eine Variable) einen Wert zurückgeben:

var obj = {
  ['hello']: 'World',
  [x + 2]: 42,
  [someObject.getId()]: someVar
}

Sie können sogar eine Liste solcher Objekte erstellen

var feeTypeList = [];
$('#feeTypeTable > tbody > tr').each(function (i, el) {
    var feeType = {};

    var $ID = $(this).find("input[id^=txtFeeType]").attr('id');

    feeType["feeTypeID"] = $('#ddlTerm').val();
    feeType["feeTypeName"] = $('#ddlProgram').val();
    feeType["feeTypeDescription"] = $('#ddlBatch').val();

    feeTypeList.push(feeType);
});

Es gibt zwei verschiedene Notationen, um auf Objekteigenschaften zuzugreifen

• Dot Notation: myObj.prop1
• Bracket - Schreibweise: myObj [ "PROP1"]

Die Punktnotation ist schnell und einfach, aber Sie müssen den tatsächlichen Eigenschaftsnamen explizit verwenden. Keine Substitution, Variablen usw.

Die Klammernotation ist offen. Es wird eine Zeichenfolge verwendet, aber Sie können die Zeichenfolge mit einem beliebigen legalen js-Code erstellen. Sie können die Zeichenfolge als Literal angeben (obwohl in diesem Fall die Punktnotation leichter lesbar wäre) oder eine Variable verwenden oder auf irgendeine Weise berechnen.

Daher setzen diese alle die myObj- Eigenschaft mit dem Namen prop1 auf den Wert Hello :

// quick easy-on-the-eye dot notation
myObj.prop1 = "Hello";

// brackets+literal
myObj["prop1"] = "Hello";

// using a variable
var x = "prop1"; 
myObj[x] = "Hello";                     

// calculate the accessor string in some weird way
var numList = [0,1,2];
myObj[ "prop" + numList[1] ] = "Hello";     

Tücken:

myObj.[xxxx] = "Hello";      // wrong: mixed notations, syntax fail
myObj[prop1] = "Hello";      // wrong: this expects a variable called prop1

tl; dnr : Wenn Sie den Schlüssel berechnen oder referenzieren möchten, müssen Sie die Klammernotation verwenden . Wenn Sie den Schlüssel explizit verwenden, verwenden Sie die Punktnotation für einfachen Code.

Hinweis: Es gibt einige andere gute und korrekte Antworten, aber ich persönlich fand sie etwas kurz, da ich mit JS on-the-fly-Skurrilität nur wenig vertraut bin. Dies kann für manche Menschen nützlich sein.

Mit lodash können Sie ein neues Objekt wie das folgende erstellen : set :

obj = _.set({}, key, val);

Oder Sie können ein vorhandenes Objekt wie folgt festlegen:

var existingObj = { a: 1 };
_.set(existingObj, 'a', 5); // existingObj will be: { a: 5 }

Sie sollten vorsichtig sein, wenn Sie einen Punkt (".") In Ihrem Pfad verwenden möchten, da lodash eine Hierarchie festlegen kann, zum Beispiel:

_.set({}, "a.b.c", "d"); // { "a": { "b": { "c": "d" } } }

Zuerst müssen wir den Schlüssel als Variable definieren und dann zum Beispiel den Schlüssel als Objekt zuweisen

var data = {key:'dynamic_key',value:'dynamic_value'}
var key = data.key;
var obj = { [key]: data.value}
console.log(obj)

Mit dem Aufkommen von ES2015 Object.assign und berechneten Eigenschaftsnamen läuft der OP-Code auf Folgendes hinaus :

var obj = Object.assign.apply({}, $(itemsFromDom).map((i, el) => ({[el.id]: el.value})));

Wenn Sie einem Objekt dynamisch Felder hinzufügen möchten, gehen Sie am einfachsten wie folgt vor:

 var params= [
{key: "k1", value=1},
{key: "k2", value=2},
{key: "k3", value=3}];

for(i=0; i< params.len; i++) {
  data[params[i].key] = params[i].value
}

Dadurch wird ein Datenobjekt mit folgenden Feldern erstellt:

{k1:1, k2:2, k3:3}

Wenn Sie ein Objekt haben, können Sie ein Array von Schlüsseln erstellen, dann zuordnen und aus vorherigen Objektschlüsseln und Werten ein neues Objekt erstellen.

Object.keys(myObject)
.map(el =>{
 const obj = {};
 obj[el]=myObject[el].code;
 console.log(obj);
});

Ajavascript hat zwei Arten von Anmerkungen zum Abrufen von Javascript-Objekteigenschaften:

Obj = {};

1) (.) Anmerkung z. Obj.id Dies funktioniert nur, wenn das Objekt bereits eine Eigenschaft mit dem Namen 'id' hat.

2) ([]) Anmerkung, z. Obj [id] hier Wenn das Objekt keine Eigenschaft mit dem Namen 'id' hat, wird eine neue Eigenschaft mit dem Namen 'id' erstellt.

also für folgendes Beispiel:

Eine neue Eigenschaft wird immer erstellt, wenn Sie Obj [Name] schreiben. Und wenn die Eigenschaft bereits mit demselben Namen vorhanden ist, wird sie überschrieben.

const obj = {}
    jQuery(itemsFromDom).each(function() {
      const element = jQuery(this)
      const name = element.attr('id')
      const value = element.attr('value')
      // This will work
      obj[name]= value;
    })

Bezogen auf das Thema, allerdings nicht speziell für jquery. Ich habe dies in ec6-Reaktionsprojekten verwendet und hilft vielleicht jemandem:

this.setState({ [`${name}`]: value}, () => {
      console.log("State updated: ", JSON.stringify(this.state[name]));
    });

PS: Bitte beachten Sie das Anführungszeichen.

objectname.newProperty = value;

const data = [{
    name: 'BMW',
    value: '25641'
  }, {
    name: 'Apple',
    value: '45876'
  },
  {
    name: 'Benz',
    value: '65784'
  },
  {
    name: 'Toyota',
    value: '254'
  }
]

const obj = {
  carsList: [{
    name: 'Ford',
    value: '47563'
  }, {
    name: 'Toyota',
    value: '254'
  }],
  pastriesList: [],
  fruitsList: [{
    name: 'Apple',
    value: '45876'
  }, {
    name: 'Pineapple',
    value: '84523'
  }]
}

let keys = Object.keys(obj);

result = {};

for(key of keys){
    let a =  [...data,...obj[key]];
    result[key] = a;

}