[페북 JS 스터디그룹] 6.1장 객체에 대한 이해

6장 1절 객체에 대한 이해

< 프론트엔드 개발자를 위한 자바스크립트>(2013 인사이트, 한선용 옮김) 의 책을 요약한 내용으로 자바스크립트 제대로 배우기 스터디 그룹(페이스북) 의 글입니다.

자바스크립트에서 객체를 어떻게 만드는 것인지에 대한 방법을 간단하게 설명하고 있으며, 객체 프로퍼티의 종류와 접근 방법에 대해 설명하면서 객체에 대한 이해를 돕고 있다.

가장 단순한 방법은 다음과 같다

var obj = new Object();
obj.name = "son";
obj.getName = function() {
return this.name;
};

또 다른 방법은 객체의 리터럴 표기법을 이용해서 만드는 방법이 있다.

var obj ={
name: "son"
     ,getName: function() {
return this.name;
}
};

6.1.1 프로퍼티 타입

ECMA-262 5판에 따른 객체 프로퍼티의 종류에는 "데이터 프로퍼티"와 접근자(accessor)프로퍼티 두가지 타입이 있습니다.

- 데이터 프로퍼티

  데이터 값에 대한 단하나의 위치를 포함하여 이 위치에서 값을 읽고 씁니다. 속성에는 다음 4가지가 있다.

[[Configurable]]	해당프로퍼티가 변경될 수 있는지의 여부   디폴트 : true
[[Enumerable]]	for-in 루프에서 해당 프로퍼티를 반환함을 나타냄   디폴트 : true
[[Writable]]	프로퍼티의 값을 바꿀 수 있음  디폴트 : true
[[Value]]	프포퍼티의 실제 데이터 값을 포함함  디폴트 : undefined

  기본 프로퍼티의 속성을 바꾸려면 Object.defineProperty() 함수를 이용해서 바꾸면 된다.

 예로,

  defineProperty( 객체변수명, 프로퍼티명, { 프로퍼티속성명:값 } );

  위와 같이 사용 할 수 있으며 프로퍼티 속성명, 값 세트는 여러개가 지정이 가능하다.

  단, 인터넷 익스플로러 8에서는 위 함수가 제대로 구현이 되지 않았으므로 사용하지 안기를 바람!!

 

- 접근자 프로퍼티

  접근자 프로퍼티는 데이터 값이 아니라 setter, getter 함수로 구성됩니다. 접근자 프로퍼티에도 다음과 같은 속성 4가지가 있습니다.

[[Configurable]]	해당프로퍼티가 변경될 수 있는지의 여부   디폴트 : true
[[Enumerable]]	for-in 루프에서 해당 프로퍼티를 반환함을 나타냄   디폴트 : true
[[Get]]	프로퍼티를 읽을때 호출할 함수  디폴트 : undefined
[[Set]]	프포퍼티를 쓸때 호출하는 함수  디폴트 : undefined

위 속성을 이용하면 getter 와 setter 를 재정의 할 수 있다.

6.1.2 다중프로퍼티의 정의

  여러개의 프로퍼티를 동시에 정의하기 위해 다음과 같은 함수를 제공한다.

  Object.defineProperties()

  단, IE9, FireFox 4, Safari 5, Opera12 이상 크롬에서 사용 가능합니다.

6.1.3 프로퍼티 속성 읽기

  앞에서 정의한 프로퍼티 속성을 다음과 같은 방법으로 읽을 수도 있다.

  Object.getOwnPropertyDescriptor( 객체변수명, "프로퍼티명" );

페이스북 그룹 자바스크립트 제대로 배우기의 스터디로 학습내용을 정리한내용입니다.

[JavaScript 스터디 다른글]

1장. 자바스크립트란 무엇인가?

2장. HTML속의 자바스크립트

3장. 언어의 기초

4장. 변수와 스코프, 메모리