Accessor property

Accessor property
접근자 프로퍼티
accessor property의 본질은 함수인데, 이 함수는 값을 획득(get)하고 설정(set)하는 역할을 담당한다.
그런데 외부 코드에서는 함수가 아닌 일반적인 property처럼 보인다.

getter, setter

accessor property는 'getter(획득자)'와 ‘setter(설정자)’ 메서드로 표현된다.
객체 리터럴 안에서 getter와 setter 메서드는 get과 set으로 나타낼 수 있다.
예시 1
```
let obj = {
  get propName() {
    // getter, obj.propName을 실행할 때 실행되는 코드
  },

  set propName(value) {
    // setter, obj.propName = value를 실행할 때 실행되는 코드
  }
};
```
- getter 메서드는 obj.propName을 사용해 프로퍼티를 읽으려고 할 때 실행되고, setter 메서드는 obj.propName = value으로 property에 값을 할당하려 할 때 실행된다.
- property name과 surname이 있는 객체 user를 만들어보자.
```
let user = {
  name: "John",
  surname: "Smith"
};
```
- 이 객체에 fullName이라는 property를 추가해 fullName이 'John Smith'가 되도록 해보자.
- 기존 값을 복사-붙여넣기 하지 않고 fullName이 'John Smith'가 되도록 하려면 accessor property를 구현하면 된다.
```
let user = {
  name: "John",
  surname: "Smith",

  get fullName() {
    return `${this.name} ${this.surname}`;
  }
};

alert(user.fullName); // John Smith
```
- 바깥 코드에선 accessor property를 일반 property처럼 사용할 수 있다.
- accessor property는 이런 아이디어에서 출발했다.
- accessor property를 사용하면 함수처럼 호출 하지 않고, 일반 property에서 값에 접근하는 것처럼 평범하게 user.fullName을 사용해 property 값을 얻을 수 있다.
- 나머지 작업은 getter 메서드가 뒷단에서 처리해준다.
- 한편, 위 예시의 fullName은 getter 메서드만 가지고 있기 때문에 user.fullName=을 사용해 값을 할당하려고 하면 에러가 발생한다.
```
let user = {
  get fullName() {
    return `...`;
  }
};

user.fullName = "Test"; // Error (프로퍼티에 getter 메서드만 있어서 에러가 발생합니다.)
```
- user.fullName에 setter 메서드를 추가해 에러가 발생하지 않도록 고쳐본다.
```
let user = {
  name: "John",
  surname: "Smith",

  get fullName() {
    return `${this.name} ${this.surname}`;
  },

  set fullName(value) {
    [this.name, this.surname] = value.split(" ");
  }
};

// 주어진 값을 사용해 set fullName이 실행됩니다.
user.fullName = "Alice Cooper";

alert(user.name); // Alice
alert(user.surname); // Cooper
```
- 이렇게 getter와 setter 메서드를 구현하면 객체엔 fullName이라는 '가상’의 property가 생긴다.
- 가상의 property는 읽고 쓸 순 있지만 실제로는 존재하지 않는다.