JavaScript에서 변수를 개체 속성 이름으로 사용할 수 있나요?

JavaScript에서 객체 속성 이름을 동적으로 정의하는 방법

JavaScript 객체 리터럴은 키-값 쌍 모음을 정의하는 데 편리합니다. 속성 이름을 나타내고 값은 속성 값을 나타냅니다. 그러나 일반적인 질문이 생깁니다. 객체 리터럴에서 변수를 키로 사용할 수 있습니까?

이 질문에 대한 대답은 JavaScript 버전에 따라 다릅니다. ES5 및 이전 버전에서는 변수를 객체 리터럴의 키로 직접 사용하는 것이 작동하지 않습니다. 예:

var thetop = 'top';
something.stop().animate({ thetop: 10 }, 10); // Doesn't work

ES5에서는 객체 속성 이름을 큰따옴표나 작은따옴표로 묶어야 하기 때문입니다.

ES5 및 이전 버전에 대한 솔루션

ES5에서 변수를 키로 사용하려면 객체 리터럴을 생성하고 변수 이름을 변수로 사용하여 수동으로 속성 값을 할당해야 합니다. 속성 키:

var aniArgs = {};
aniArgs[thetop] = 10; // Assign value to property using variable name as key
something.stop().animate(aniArgs, 10); // Pass the object literal to the animate method

ES6 계산된 속성 이름

ES6에서는 변수 및 표현식을 객체 리터럴 내 속성 이름으로 사용할 수 있는 ComputedPropertyName 개념을 도입했습니다. 이 구문은 다음과 같습니다.

const obj = { [variableOrExpression]: value };

이 구문을 사용하면 변수를 사용하여 속성 이름을 동적으로 정의할 수 있습니다. 예:

var thetop = 'top';
const obj = { [thetop]: 10 };
console.log(obj.top); // Prints 10

이 구문은 최신 브라우저에서 지원되며 다음을 단순화할 수 있습니다. 객체 속성 이름을 동적으로 정의하는 프로세스

위 내용은 JavaScript에서 변수를 개체 속성 이름으로 사용할 수 있나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!