[ES6] 16. getter, setter

getter 와 setter

---

오브젝트 내의 함수들을 괄호 없이 쓸 수 있고,

데이터의 무결성을 보존하기 위해 쓰는 키워드이다.

immutable

데이터를 수정하거나 출력할 때 직접 원본 데이터를 다루는게 아니라

함수로 간접적으로 다루어야 하는게 트렌드이다.

데이터 확인

var 사람 = {
  name : 'Kim',
  age : 30,
}

내년 나이를 출력해 보고 싶다면,

사람.age + 1 이라고 출력하면 될 것이다.

그런데 미래를 생각한다면 내년 나이를 출력해 주는 함수를 만들어 사용하는것이 더 이로울 것이다.

사람.nextAge()를 사용하면 내년 나이를 알 수 있을 것이다.

var 사람 = {
  name : 'Kim',
  age : 30,
  nextAge(){
    return this.age + 1
  }
}

이런 코드는,

• object안의 데이터가 복잡할 수록 데이터를 꺼내기 쉽고
• 내부에 있는 name, age 변수를 건드리지 않아서 실수를 방지할 수 있다.

데이터 수정

객체 안에 있는 age를 수정하려면

사람.age = 40 과 같이 입력하면 되지만.

데이터 수정을 위한 함수를 만들어 두는 것이 좋을 것이다.

var 사람 = {
  name : 'Kim',
  age : 30,
  setAge(나이){
    this.age = 나이
  }
}

함수를 만들면 내부에 있는 name, age 변수를 직접 건드리지 않아서 실수를 방지할 수 있다.

get / set

set

var 사람 = {
  name : 'Kim',
  age : 30,
  set setAge(나이){
    this.age = parseInt(나이)
  }
}

사람.setAge = 40;

함수를 만들 때 왼쪽에 set이라는 키워드를 추가하면

할당연산자로 데이터 입력이 가능하다.

보기도 쉽고 직관적이다.

데이터를 set(수정)하는 함수라는 뜻으로 setter 함수라고 부른다.

• 데이터를 입력해 수정해 주는 함수이니 파라미터가 한 개 이상 있어여 한다.

get

var 사람 = {
  name : 'Kim',
  age : 30,
  get nextAge(){
    return  this.age + 1  
  }
}

console.log(사람.nextAge); // 31

마찬가지로 데이터를 get(가져오는) 함수라는 뜻으로 getter 함수라고 부른다.

• 파라미터가 있으면 안되고 return 키워드가 있어야 한다.

class에서도 getter/setter 를 사용할 수 있다.

class 사람 {
  constructor(){
    this.name = 'Park';
    this.age = 20;
  }
  get nextAge(){
    return this.age + 1
  }
  set setAge(나이){
    this.age = 나이;
  }
}

var 사람1 = new 사람();