JavaScript ES5 객체 메서드

ECMAScript 5 (2009)는 JavaScript에 많은 새로운 객체 메서드를 추가했습니다.

객체 관리

// 기존 객체를 원형으로 객체 생성
Object.create()
// 객체 속성 추가 또는 변경
Object.defineProperty(object, property, descriptor)
// 객체 속성 추가 또는 변경
Object.defineProperties(object, descriptors)
// 속성 접근
Object.getOwnPropertyDescriptor(object, property)
// 배열로 모든 속성 return
Object.getOwnPropertyNames(object)
// 원형에 접근
Object.getPrototypeOf(object)
// 배열로 return 가능 속성
Object.keys(object)

객체 보호

// 객체에 속성 추가 방지
Object.preventExtensions(object)
// 속성이 객체에 추가될 수 있으면 true를 반환
Object.isExtensible(object)
// 객체 속성 변경 방지(값이 아님)
Object.seal(object)
// 객체가 마취되면 true를 반환
Object.isSealed(object)
// 객체에 대한 어떠한 변경도 방지
Object.freeze(object)
// 객체가 얼려지면 true를 반환
Object.isFrozen(object)

속성 값 변경

문법

Object.defineProperty(object, property, {value : value)

인스턴스

이 예제에서 속성 값을 변경합니다:

const person = {
  firstName: "Bill",
  lastName : "Gates",
  language : "EN"
};
// 속성 수정
Object.defineProperty(person, "language", {value : "NO"});

직접 시도해 보세요

메타데이터 변경

ES5는 다음 속성 메타데이터를 변경 허용합니다:

writable : true      // 속성 값을 변경할 수 있음
enumerable : true    // 속성을 순회할 수 있음
configurable : true  // 속성을 다시 설정할 수 있음
writable : false     // 속성 값을 변경할 수 없음
enumerable : false   // 속성을 순회할 수 없음
configurable : false // 속성을 재구성할 수 없음

ES5는 getter와 setter를 변경할 수 있음을 허용합니다:

// 정의 게터
get: function() { return language }
// 정의 세터
set: function(value) { language = value }

이 예제는 language를 읽기 전용으로 설정합니다:

Object.defineProperty(person, "language", {writable:false});

이 예제는 language를 셀프 인덱싱 속성으로 만듭니다:

Object.defineProperty(person, "language", {enumerable:false});

모든 속성 나열

이 예제는 객체의 모든 속성을 나열합니다:

인스턴스

const person = {
  firstName: "Bill",
  lastName : "Gates",
  language : "EN"
};
Object.defineProperty(person, "language", {enumerable:false});
Object.getOwnPropertyNames(person);  // 배열의 배열을 반환

직접 시도해 보세요

셀프 인덱싱 속성 나열

이 예제는 객체의 셀프 인덱싱 속성만 나열합니다:

인스턴스

const person = {
  firstName: "Bill",
  lastName : "Gates",
  language : "EN"
};
Object.defineProperty(person, "language", {enumerable:false});
Object.keys(person);  // 셀프 인덱싱 속성의 배열을 반환

직접 시도해 보세요

속성 추가

이 예제는 객체에 새 속성을 추가합니다:

인스턴스

// 객체 생성
const person = {
  firstName: "Bill",
  lastName : "Gates",
  language : "EN"
};
// 속성 추가
Object.defineProperty(person, "year", {value:"2008"});

직접 시도해 보세요

Getter와 Setter 추가

Object.defineProperty() 메서드는 Getter와 Setter를 추가하는 데도 사용될 수 있습니다:

인스턴스

// 객체 생성
const person = {firstName:"Bill", lastName:"Gates"};
// 정의 게터
Object.defineProperty(person, "fullName", {
  get: function () {return this.firstName + " " + this.lastName;}
});

직접 시도해 보세요

카운터 인스턴스

// 객체 정의
const obj = {counter:0};
// 정의 세터
Object.defineProperty(obj, "reset", {
  get : function () {this.counter = 0;}
});
Object.defineProperty(obj, "increment", {
  get : function () {this.counter++;}
});
Object.defineProperty(obj, "decrement", {
  get : function () {this.counter--;}
});
Object.defineProperty(obj, "add", {
  set : function (value) {this.counter += value;}
});
Object.defineProperty(obj, "subtract", {
  set : function (i) {this.counter -= i;}
});
// 카운터 작업:
obj.reset;
obj.add = 5;
obj.subtract = 1;
obj.increment;
obj.decrement;

직접 시도해 보세요