如何使用變數名稱動態新增屬性至 JavaScript 物件？

如何在 JavaScript 物件上動態新增屬性

使用 DOM 元素時，通常需要使用這些元素的 ID。考慮以下情況：

您有一個使用 jQuery 檢索的 DOM 元素數組，並且您希望使用每個元素的 ID 設定物件的屬性。

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;
});

上面的程式碼將在物件上設定一個屬性，但無論元素的 ID 是什麼，屬性名稱始終為「name」。要使用變數動態設定屬性名稱，您應該使用括號和變數名稱：

obj[name] = value;

這允許您使用 ID 或任何其他變數作為屬性名稱在物件上建立屬性。

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

console.log(obj); // Output: { the_key: 'the_value' }

或者，您可以使用ES6 功能來獲得更簡潔的語法：

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

console.log(obj); // Output: { the_key: 'the_value' }

使用括號允許您動態設定JavaScript 物件的屬性名稱，為您提供更大的靈活性和對資料操作的控制。

以上是如何使用變數名稱動態新增屬性至 JavaScript 物件？的詳細內容。更多資訊請關注PHP中文網其他相關文章！