Heim > Web-Frontend > js-Tutorial > Wie füge ich mithilfe von Variablennamen dynamisch Eigenschaften zu JavaScript-Objekten hinzu?

Wie füge ich mithilfe von Variablennamen dynamisch Eigenschaften zu JavaScript-Objekten hinzu?

Susan Sarandon
Freigeben: 2024-12-23 19:59:13
Original
773 Leute haben es durchsucht

How to Dynamically Add Properties to JavaScript Objects Using Variable Names?

So fügen Sie Eigenschaften dynamisch zu einem JavaScript-Objekt hinzu

Bei der Arbeit mit DOM-Elementen kommt es häufig vor, dass Eigenschaften für Objekte mithilfe von festgelegt werden müssen IDs dieser Elemente. Stellen Sie sich die folgende Situation vor:

Sie haben ein Array von DOM-Elementen, die mit jQuery abgerufen wurden, und Sie möchten Eigenschaften für ein Objekt mithilfe der IDs jedes Elements festlegen.

const obj = {};

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

  // This line does not work as intended:
  obj.name = value;
});
Nach dem Login kopieren

Der obige Code legt eine Eigenschaft für das Objekt fest, aber der Eigenschaftsname lautet immer „name“, unabhängig von der ID des Elements. Um den Eigenschaftsnamen mithilfe einer Variablen dynamisch festzulegen, sollten Sie Klammern und den Variablennamen verwenden:

obj[name] = value;
Nach dem Login kopieren

Dadurch können Sie Eigenschaften für das Objekt erstellen, indem Sie die IDs oder eine andere Variable als Eigenschaftsnamen verwenden.

let obj = {};
obj["the_key"] = "the_value";

console.log(obj); // Output: { the_key: 'the_value' }
Nach dem Login kopieren

Alternativ können Sie ES6-Funktionen für eine prägnantere Syntax verwenden:

let key = "the_key";
let obj = {
  [key]: "the_value"
};

console.log(obj); // Output: { the_key: 'the_value' }
Nach dem Login kopieren

Die Verwendung von Klammern ermöglicht Ihnen dies Legen Sie Eigenschaftsnamen für JavaScript-Objekte dynamisch fest, was Ihnen mehr Flexibilität und Kontrolle über die Datenbearbeitung gibt.

Das obige ist der detaillierte Inhalt vonWie füge ich mithilfe von Variablennamen dynamisch Eigenschaften zu JavaScript-Objekten hinzu?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Neueste Artikel des Autors
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage