변수 이름을 사용하여 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 중국어 웹사이트의 기타 관련 기사를 참조하세요!