如何使用变量名动态向 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中文网其他相关文章！