JavaScript 개체: 이름으로 변수 속성에 문자열로 액세스합니다.
아래와 같은 javascript 오브젝트가 있는 경우
var columns = {
left: true,
center : false,
right : false
}
오브젝트나 속성명을 모두 건네주는 기능을 가지고 있습니다.
//should return false
var side = read_prop(columns, 'right');
본체는 무엇일까?read_prop(object, property)어떻게 생겼나요?
함수는 필요 없습니다.괄호 표기법만 사용하시면 됩니다.
var side = columns['right'];
이것은 점 표기법과 같습니다.var side = columns.right;단,right괄호 표기법을 사용할 경우 변수, 함수 반환 값 등에서 가져올 수도 있습니다.
필요한 기능은 다음과 같습니다.
function read_prop(obj, prop) {
return obj[prop];
}
아래 코멘트 중 원래 질문과 직접 관련이 없는 코멘트에 답하기 위해 여러 개의 괄호를 사용하여 중첩된 개체를 참조할 수 있습니다.다음과 같이 중첩된 개체가 있는 경우:
var foo = { a: 1, b: 2, c: {x: 999, y:998, z: 997}};
속성에 액세스 할 수 있습니다.x의c다음과 같습니다.
var cx = foo['c']['x']
속성이 정의되지 않은 경우 참조하려고 하면 반환됩니다.undefined(없음)null또는false):
foo['c']['q'] === null
// returns false
foo['c']['q'] === false
// returns false
foo['c']['q'] === undefined
// returns true
SiefMaster의 답변은 100% 정확합니다. 그러나 이와 유사한 문제에 직면했습니다. 즉, 중첩된 개체(개체 내의 개체)에서 속성을 가져와야 하므로, 그의 답변 대신 재귀 솔루션을 만들면 깊이에 관계없이 모든 속성을 가져올 수 있는 명명법을 정의할 수 있습니다.
function fetchFromObject(obj, prop) {
if(typeof obj === 'undefined') {
return false;
}
var _index = prop.indexOf('.')
if(_index > -1) {
return fetchFromObject(obj[prop.substring(0, _index)], prop.substr(_index + 1));
}
return obj[prop];
}
지정된 속성 Resumb에 대한 문자열 참조 위치property1.property2
JsFiddle의 코드와 코멘트.
위의 답변으로 프로젝트를 지원받았기 때문에(중복 질문을 하고 여기에 회부받았기 때문에) VAR 내에 네스트 할 때 괄호 표기에 대한 답변(테스트 코드)을 제출합니다.
<html>
<head>
<script type="text/javascript">
function displayFile(whatOption, whatColor) {
var Test01 = {
rectangle: {
red: "RectangleRedFile",
blue: "RectangleBlueFile"
},
square: {
red: "SquareRedFile",
blue: "SquareBlueFile"
}
};
var filename = Test01[whatOption][whatColor];
alert(filename);
}
</script>
</head>
<body>
<p onclick="displayFile('rectangle', 'red')">[ Rec Red ]</p>
<br/>
<p onclick="displayFile('square', 'blue')">[ Sq Blue ]</p>
<br/>
<p onclick="displayFile('square', 'red')">[ Sq Red ]</p>
</body>
</html>언급URL : https://stackoverflow.com/questions/4255472/javascript-object-access-variable-property-by-name-as-string
'programing' 카테고리의 다른 글
| "assert" 키워드의 역할은 무엇입니까? (0) | 2023.01.02 |
|---|---|
| 파일 핸들을 사용하여 파일 이름 가져오기(또는 파일 삭제) (0) | 2023.01.02 |
| PHP 응용 프로그램에서 다중 스레딩을 사용하려면 어떻게 해야 합니까? (0) | 2023.01.02 |
| MySQL 쉼표로 구분된 두 테이블 결합 (0) | 2023.01.02 |
| JFrame 아이콘 변경 방법 (0) | 2023.01.02 |