[JS] Getter와 Setter

class Student {
  constructor(firstName, lastName) {
    this.firstName = firstName;
    this.lastName = lastName;
  }

  fullName() {
    return `${this.lastName} ${this.firstName}`;
  }
}

위처럼 firstName과 lastName을 생성자로 받고, fullName을 만들어주는 Student 클래스가 있다.

Student 인스턴스를 생성하고, fullName을 console에 찍어보자.

const student = new Student('길동', '홍');
console.log(student.fullName()); // 홍 길동

그럼 위와 같은 코드를 작성하게 될 것이다.

full name은 사실 프로퍼티의 성격을 띠고있지만, firstName과 lastName을 합쳐 동적으로 만들어야 하기 때문에 메소드로 작성할 수밖에 없다.

그래서 full name이 프로퍼티의 성격을 가짐에도 불구하고 student.fullName()처럼 메소드를 호출해야 하는 약간은 이상한 코드가 만들어진다.

이러한 경우에 메소드를 속성처럼 사용할 수 있는 방법이 있는데 바로 getter와 setter이다.

 

 

 

 

 

📚 getter와 setter

class Student {
  constructor(firstName, lastName) {
    this.firstName = firstName;
    this.lastName = lastName;
  }

  get fullName() {
    return `${this.lastName} ${this.firstName}`;
  }
}

getter와 setter는 접근자 프로퍼티라고도 하는데 실제 존재하는 프로퍼티는 아니지만, 객체의 메소드를 프로퍼티처럼 사용할 수 있게 해준다.

getter는 위 코드에서처럼 메소드 앞에 get 키워드를 붙이면 만들 수 있다.

그러면 다음과 같이 사용할 수 있게 된다.

const student = new Student('길동', '홍');
console.log(student.fullName); // 홍 길동

fullName()을 호출하지 않고 프로퍼티 처럼 사용할 수 있게 되었다.

 

 

 

이번엔 setter를 만들어보자.

마찬가지로 메소드 앞에 set 키워드를 붙이면 된다.

class Student {
  constructor(firstName, lastName) {
    this.firstName = firstName;
    this.lastName = lastName;
  }

  get fullName() {
    return `${this.lastName} ${this.firstName}`;
  }

  set fullName(value) {
    [this.firstName, this.lastName] = value.split(' ');
  }
}

setter는 다음과 같이 사용할 수 있다.

const student = new Student('길동', '홍');
student.fullName = '바름 정';
console.log(student.fullName); // 정 바름

getter와 마찬가지로 메소드를 프로퍼티처럼 사용할 수 있게 되었다.

 

 

 

여기서 getter와 setter의 메소드 이름은 같은데 console.log(student.fullName);에서는 getter가 호출되고,

student.fullName = '바름 정';에서는 setter가 호출된다. 각 메소드들이 호출되는 기준은 무엇일까?

student.fullName = '바름 정';
console.log(student.fullName); // 정바름

위 코드에서 student.fullName = '바름 정'; 처럼 fullName에 무언가를 할당할 때는 setter가 호출되고,

console.log(student.fullName); 처럼 fullName에 접근할 때는 getter가 호출된다.

즉 접근자 프로퍼티를 어떻게 사용하느냐에 따라 호출되는 메소드가 달라진다.

 

 

 

+ 결과적으로 프로퍼티의 성격을 띠고 있지만, 메소드로 구현되는 무언가를 객체 외부에서 프로퍼티처럼 이용하기 위해서는 getter와 setter를 사용해야 한다.