(JS) 속성 접근자

호두파파·2021년 2월 13일
0

호두파파 JS 스터디

목록 보기
10/27

속성 접근자는 점 또는 괄호 표기법으로 객체의 속성에 접근할 수 있도록 해줍니다.

object.property
object['property']

객체는 속성의 이름을 키로 사용하는 연관 배열(다른 이름으로는 맵, 딕셔너리, 해시, 룩업 테이블)로 생각 할 수 있다. 보통 객체의 속성을 메서드와 구별해서 말하지만, 메서드는 호출할 수 있는 속성일 뿐으로, 속성의 값이 fucntion을 가리키는 참조라면 그 속성을 메서드라고 한다.

속성에 접근하는 법은 점 표기법과 괄호 표기법 두 가지가 있다.

점 표기법

get = object.property
object.property = set;
// document.createElement('pre');

이 코드에서 property는 유요한 javaScript 식별자여야 한다.
"createElement"라는 이름을 가진 메서드를 document에서 찾아 호출하는 것을 볼 수 있다.

괄호 표기법

get = object[property_name];
object[property_name] = set;
// document['createElement']('pre');

괄호 표기법에서는 property_name으로 문자열이나 symbol을 사용할 수도 있다

속성 이름

속성의 이름은 문자열이나 symbol이다. 숫자 등의 다른 자료형은 문자열로 변환된다.

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

위 코드의 1은 '1'로 변환되므로, 출력 결과는 "value"입니다.

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

위의 코드 역시 foo bar같은 문자열로 변환되므로, 출력결과는 동일하게 "value"다.

메서드 바인딩

메서드는 해당 메서드의 객체에 바인딩되지 않는다. 특히 this는 매서드 내에 고정되지 않으므로 this가 항상 현재 메서드를 포함하는 객체를 참조하는 것이 아니다.
대신, this는 함수 호출방식에 따라 "전달"된다.

profile
안녕하세요 주니어 프론트엔드 개발자 양윤성입니다.

0개의 댓글