[JavaScript] getter / setter

 getter / setter

getter와 setter는 보통 사용자로 하여금 원하는 값이 아닌 값을 받았을때 개발자가 원하는 값으로 변경해서 값을 할당하는 방법이다.

즉, 프로퍼티 값을 원하는대로 통제할 수 있다.

접근자 프로퍼티인 getter와 setter는 get과 set으로 나타낼 수 있다.

'use strict'

class User {
constructor(name, gender, age) {
this.name = name;
this.gender = gender;
this.age = age;
}

//값을 리턴
get age() {
return this._age;
}

//값을 설정
set age(value) {
this._age = value < 0 ? 0 : value;
}
}

const user1 = new User('steve', 'male', -1);

console.log(user1); // User { name: 'steve', gender: 'male', _age: 0 }

getter 메서드는 User.age 를 사용해 프로퍼티를 읽으려고 할 때 실행되고, 
setter 메서드는 User.age = age 로 프로퍼티에 값을 할당하려 할 때 실행된다.


this.age = age; 에서 

앞에 this.age 는 get age(){ return this._age } 를 가리키며

뒤에 값을 할당하는 age 는 set age(value){ this._age = value < 0 ? 0 : value } 를 가리킨다. 


get과 set메서드에서 this.age 가 아닌 this._age를 사용한것은 위에 생성자와 동일하게 작성할 경우 callstack이 쌓이게 되면서 오류가 발생하여 다른 명칭의 프로퍼티로하여 값을 할당한 것이다.

즉, 값을 할당할때 바로 메모리에 할당하는것이 아니라 get과 set 메서드를 통해서 값을 할당하고 메모리를 할당하기 때문에 

값 age를 할당하면 set age() 메서드가 실행되면서 값을 할당하게 되는데 만약 this.age라고 작성하게되면 this.age에 값을 무한정으로 호출하게되어 오류가 발생하는 것이다.

그래서 이러한 오류를 방지하기 위해서는 변수의 이름을 살작 다르게 작성해야한다. 다른 명칭으로 작성해도 되지만 _(언더바)를 사용해도 간단하게 해결할 수 있다.




댓글