속성 접근자

속성 접근자(property accessor)는 점 또는 각괄호 표기법을 사용하여 객체 속성에 대한 액세스를 제공합니다.

구문

object.property
object["property"]

설명

누구나 객체를 associative array(연관 배열, 일명 map, dictionary, hash, lookup table)로 생각할 수 있습니다. 이 배열의 key는 객체의 속성명입니다. 객체의 속성에 관해 말하는 경우는 보통 속성과 메서드 사이를 구별하기 위해서입니다. 그러나, 속성/메서드 구별은 관례에 불과합니다. 메서드는 그저 호출될 수 있는 속성입니다, 예를 들어 그 값으로 Function 인스턴스에 대한 참조가 있는 경우에.

속성에 액세스하는 두 가지 방법이 있습니다: 점 표기법 및 각괄호 표기법.

점 표기법

get = object.property;
object.property = set;

이 코드에서, property는 유효한 JavaScript 식별자(identifier)여야 합니다, 즉 숫자로 시작할 수 없는 일련의 영숫자(alphanumerical) 문자입니다, 밑줄("_") 및 달러 기호("$")를 포함하는. 예를 들어, object.$1은 유효하지만 object.1은 아닙니다.

document.createElement('pre');

여기서, "createElement"라고 하는 메서드는 document에서 검색되어 호출됩니다.

각괄호 표기법

get = object[property_name];
object[property_name] = set;

property_name은 문자열입니다. 문자열은 유효한 식별자일 필요는 없습니다. 따라서 어떤 값이든 가질 수 있습니다, 가령 "1foo", "!bar!" 또는 심지어 " "(빈칸)도.

document['createElement']('pre');

이는 이전 예와 정확히 같은 일을 합니다.

속성 이름

속성명은 문자열이어야 합니다. 이는 비문자열 객체는 객체에서 키로 사용될 수 없음을 뜻합니다. 숫자를 포함하는 모든 비문자열 객체는 toString 메서드를 통해 문자열로 형변환(typecast)됩니다.

var object = {};
object['1'] = 'value';
console.log(object[1]);

이 출력은 "value", 1이 '1'로 형변환되기에.

var foo = {unique_prop: 1}, bar = {unique_prop: 2}, object = {};
object[foo] = 'value';
console.log(object[bar]);

이 역시 출력은 "value", foo 및 bar 모두 같은 문자열로 변환되기에. SpiderMonkey JavaScript 엔진에서, 이 문자열은 "['object Object']"이 될 겁니다.

메서드 바인딩

메서드는 그 메서드의 객체에 바인딩되지 않습니다. 특히, this는 메서드 내에 고정되지 않습니다, 즉 this는 반드시 메서드를 포함하는 객체를 참조하지 않습니다. this는 대신에 함수 호출에 의해 "전달됩니다". 메서드 바인딩 참조.

eval에 대한 주의사항

JavaScript 초심자는 종종 각괄호 표기법이 대신 쓰일 수 있는 곳에 eval을 사용하는 실수를 합니다. 예를 들어, 다음 구문은 자주 많은 스크립트에서 볼 수 있습니다.

x = eval('document.forms.form_name.elements.' + strFormControl + '.value');

eval은 느리고 가능한 한 피해야 합니다. 또한, strFormControl은 식별자를 지녀야 할 겁니다, 폼 컨트롤의 이름 및 ID에 필요치 않은. 대신에 각괄호 표기법을 쓰는 게 더 좋습니다:

x = document.forms["form_name"].elements[strFormControl].value;

스펙

스펙 상태 설명
ECMAScript 2017 Draft (ECMA-262)
The definition of 'Property Accessors' in that specification.
Draft  
ECMAScript 2015 (6th Edition, ECMA-262)
The definition of 'Property Accessors' in that specification.
Standard  
ECMAScript 5.1 (ECMA-262)
The definition of 'Property Accessors' in that specification.
Standard  
ECMAScript 1st Edition (ECMA-262)
The definition of 'Property Accessors' in that specification.
Standard 초기 정의. JavaScript 1.0에서 구현됨.

브라우저 호환성

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari
Basic support (Yes) (Yes) (Yes) (Yes) (Yes)
Feature Android Chrome for Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Basic support (Yes) (Yes) (Yes) (Yes) (Yes) (Yes)

참조

문서 태그 및 공헌자

태그: 
 이 페이지의 공헌자: Netaras
 최종 변경: Netaras,