객체 프로퍼티 접근자(get, set)

JA_X·2023년 6월 1일
0

객체 프로퍼티 접근자

JavaScript 객체의 프로퍼티 접근자에는 get과 set이라는 키워드가 있다.
이를 사용하여 객체의 프로퍼티를 읽거나 설정할 수 있다.

  1. get 접근자:
  • get 접근자는 객체의 프로퍼티 값을 읽을 때 사용됩니다.
  • get 접근자는 프로퍼티에 대한 값을 반환합니다.
  • get 접근자는 메소드가 아니라 일반 프로퍼티처럼 사용됩니다.
  • 객체 내에서 get으로 정의된 메소드는 해당 프로퍼티에 접근할 때 자동으로 호출됩니다.
const obj = {
  get myProperty() {
    return 'Hello, World!';
  }
};

console.log(obj.myProperty); // 출력: "Hello, World!"
console.log(obj); // {}

// get 접근자를 사용해 myProperty라는 프로퍼티를 만들고 'Hello, World!'를 반환하는 함수식 처럼 쓰임
// 특이한 점은 해당 프로퍼티에 접근할 때 호출되는 것이지 obj를 호출할 때는 빈 객체로 보임
  1. set 접근자:
  • set 접근자는 객체의 프로퍼티 값을 설정할 때 사용됩니다.
  • set 접근자는 프로퍼티에 값을 할당할 때 호출됩니다.
  • set 접근자는 메소드가 아니라 일반 프로퍼티처럼 사용됩니다.
  • 객체 내에서 set으로 정의된 메소드는 해당 프로퍼티에 값을 할당할 때 자동으로 호출됩니다.
const obj = {
  value: '',
  set myProperty(newValue) {
    this.value = newValue;
  }
};

obj.myProperty = 'Hello, World!';
console.log(obj.value); // 출력: "Hello, World!"

// set 접근자를 사용해 객체의 프로퍼티 값을 설정할 수 있다.
// 위의 예제는 newValue라는 인자는 받아서 value 프로퍼티의 값으로 할당하고 있다.
// get 과 같이 obj 호출 시 나열되진 않지만 값을 할당 할 경우 작동한다.

get, set 활용 예제

const person = {
	_firstName: 'Lee',
	lastName: 'Jae-Sung',

  	// person.firtName 호출 시 해당 값을 모두 대문자로 출력
	get firstName() {
		return this._firstName.toUpperCase();
	},
	// person.firstName 에 문자열이 아닌 다른 값을 할당하면 undefined name 할당됨
	set firstName(newFirstName) {
		if (typeof newFirstName !== 'string') {
			this._firstName = 'undefined name';

			return;
		}

		this._firstName = newFirstName;
	},
	// person.fullName 호출 시 해당 값 리턴 
	get fullName() {
		return (
			this._firstName +
			' ' +
			this.lastName +
			' ' +
			'입니다'
		);
	},
};

console.log(person.firstName); // LEE

console.log(person.fullName); // Lee Jae-Sung 입니다

get과 set 접근자를 사용하여 객체의 프로퍼티에 대한 읽기 및 쓰기 동작을 커스터마이즈할 수 있습니다. 이를 통해 프로퍼티 값을 동적으로 계산하거나 유효성 검사를 수행할 수 있습니다.
(get 은 호출 시! set은 할당 시!)

0개의 댓글