자바스크립트에서 getter와 setter란 무엇인가요?

Q1: getter와 setter란 무엇인가요?
A1:
- getter(접근자): 객체 프로퍼티 값을 읽을 때 호출되는 메서드
- setter(설정자): 객체 프로퍼티에 값을 할당할 때 호출되는 메서드
이 둘은 프로퍼티 접근 시점에 부가 로직(검증, 계산 등)을 삽입할 수 있게 해줍니다.

Q2: 왜 getter와 setter를 사용하나요?
A2:
- 캡슐화(encapsulation): 내부 데이터에 대한 직접 접근을 제한하고 검증 로직을 적용
- 계산된 프로퍼티(computed property): 다른 값에 기반해 동적으로 값을 반환
- 읽기 전용 또는 쓰기 전용 속성 생성
- 로그, 캐싱, 디버깅용 부가 작업 수행

Q3: 객체 리터럴에서 getter와 setter를 정의하는 방법은?
A3:
```javascript
const person = {
firstName: 'Jane',
lastName: 'Doe',
get fullName() {
return `${this.firstName} ${this.lastName}`;
},
set fullName(name) {
const [first, last] = name.split(' ');
this.firstName = first;
this.lastName = last;
}
};

console.log(person.fullName); // "Jane Doe" ← getter 자동 호출
person.fullName = 'John Smith'; // setter 자동 호출
console.log(person.firstName); // "John"
```

Q4: Object.defineProperty로 정의하는 방법은?
A4:
```javascript
const obj = {};
Object.defineProperty(obj, 'value', {
get() {
return this._value;
},
set(val) {
if (typeof val !== 'number') throw new TypeError('숫자만 허용');
this._value = val;
},
enumerable: true, // for…in이나 Object.keys()에 포함 여부
configurable: true // 이후 정의 변경/삭제 가능 여부
});

obj.value = 10; // setter 호출
console.log(obj.value);// getter 호출 → 10
```
Q5: 클래스(class) 문법에서 사용하는 방법은?
A5:
```javascript
class Rectangle {
constructor(width, height) {
this._width = width;
this._height = height;
}
get area() {
return this._width * this._height;
}
set width(w) {
if (w <= 0) throw new Error('너비는 양수여야 합니다.');
this._width = w;
}
}

const rect = new Rectangle(5, 4);
console.log(rect.area); // 20
rect.width = 10; // setter 호출
```

Q6: getter/setter 호출 방식은 일반 프로퍼티와 어떻게 다른가요?
A6:
- 호출 시점: `obj.prop` 접근 → getter 자동 실행
- 대입 시점: `obj.prop = value` → setter 자동 실행
- 메서드처럼 `obj.prop()` 로 호출할 수 없고, 함수를 반환하는 getter일 경우 `obj.prop()`로 실행해야 함

Q7: 무한 루프에 빠지지 않으려면?
A7:
- getter나 setter 내부에서 동일한 프로퍼티(`this.prop`)를 직접 참조하지 말 것
- 내부 저장용 프로퍼티(예: `_prop`)를 별도로 사용

Q8: 장단점은?
A8:
장점
- 내부 검증 로직 일원화
- 외부 인터페이스 단순화
- 계산된 값 자동 갱신
단점
- 디버깅 시 호출 흐름 파악이 어려울 수 있음
- 잦은 getter/setter 호출은 성능에 영향

Q9: 주의사항 및 팁
A9:
- `enumerable`, `configurable` 속성 조정으로 외부 노출 수준 제어
- 꼭 필요한 곳에만 사용해 과도한 프로퍼티 접근 비용 방지
- 프록시(Proxy)나 리액티브 라이브러리(Vue, MobX 등)와 비교 검토

Q10: 요약
A10:
getter와 setter는 자바스크립트 객체의 프로퍼티 접근 시점에 함수 로직을 실행하도록 해주는 기법으로, 데이터 검증·계산·캡슐화 목적으로 활용됩니다. 객체 리터럴, `Object.defineProperty`, 클래스 세 가지 방식으로 정의할 수 있으며, 내부 프로퍼티와 외부 인터페이스를 깔끔하게 분리하는 데 유용합니다.

자바스크립트에서 getter와 setter는 객체의 속성에 대한 접근과 수정 방식을 정의하는 특별한 메소드입니다.

이들은 객체의 프로퍼티에 대한 읽기 및 쓰기 작업을 제어하고, 데이터의 유효성을 검사하거나 추가적인 로직을 실행할 수 있도록 도와줍니다.

getter와 setter는 ES5(ECMAScript

5)에서 도입되었으며, ES6(ECMAScript 201

5)에서는 클래스 문법에서도 사용할 수 있게 되었습니다.

Gettergetter는 객체의 속성 값을 읽을 때 호출되는 메소드입니다.

일반적으로 `get` 키워드를 사용하여 정의합니다.

getter를 사용하면 속성에 대한 접근을 제어할 수 있으며, 속성 값을 계산하거나 변환할 수 있습니다.

예제```javascriptconst person = { firstName: 'John', lastName: 'Doe', get fullName() { return `${this.firstName} ${this.lastName}`; }};console.log(person.fullName); // "John Doe"```위의 예제에서 `fullName`은 getter로 정의되어 있습니다.

`person.fullName`을 호출하면 `fullName` 메소드가 실행되어 `firstName`과 `lastName`을 결합한 문자열을 반환합니다.

Settersetter는 객체의 속성 값을 설정할 때 호출되는 메소드입니다.

`set` 키워드를 사용하여 정의합니다.

setter를 사용하면 속성에 값을 할당할 때 추가적인 로직을 실행하거나, 데이터의 유효성을 검사할 수 있습니다.

예제```javascriptconst person = { firstName: 'John', lastName: 'Doe', set fullName(name) { const parts = name.split(' '); this.firstName = parts[0]; this.lastName = parts[1]; }};person.fullName = 'Jane Smith';console.log(person.firstName); // "Jane"console.log(person.lastName); // "Smith"```위의 예제에서 `fullName`은 setter로 정의되어 있습니다.

`person.fullName = 'Jane Smith'`를 호출하면 setter가 실행되어 `name`을 공백으로 분리하고, `firstName`과 `lastName` 속성을 업데이트합니다.

사용 이유getter와 setter를 사용하는 이유는 여러 가지가 있습니다:1. 캡슐화 : 객체의 내부 상태를 보호하고, 외부에서 직접 접근하는 것을 방지할 수 있습니다.

이를 통해 객체의 일관성을 유지할 수 있습니다.

2. 유효성 검사 : setter를 사용하여 속성에 값을 할당할 때 유효성을 검사할 수 있습니다.

예를 들어, 특정 형식의 데이터만 허용하거나, 특정 조건을 만족하는 경우에만 값을 설정할 수 있습니다.

3. 계산된 속성 : getter를 사용하여 다른 속성의 값을 기반으로 계산된 값을 반환할 수 있습니다.

이를 통해 코드의 중복을 줄이고, 유지보수를 용이하게 할 수 있습니다.

4. 디버깅 및 로깅 : getter와 setter에 로깅 기능을 추가하여 속성의 변경 이력을 추적할 수 있습니다.

이는 디버깅에 유용합니다.

클래스에서의 사용ES6부터는 클래스 문법에서도 getter와 setter를 사용할 수 있습니다.

클래스 내부에서 정의된 getter와 setter는 인스턴스의 속성처럼 사용할 수 있습니다.

예제```javascriptclass Rectangle { constructor(width, height) { this.width = width; this.height = height; } get area() { return this.width * this.height; } set dimensions(dimensions) { [this.width, this.height] = dimensions; }}const rect = new Rectangle(10,

5);console.log(rect.area); // 50rect.dimensions = [20, 10];console.log(rect.area); // 200```위의 예제에서 `Rectangle` 클래스는 `area`라는 getter와 `dimensions`라는 setter를 가지고 있습니다.

`area`는 사각형의 면적을 계산하여 반환하고, `dimensions`는 배열을 통해 너비와 높이를 동시에 설정할 수 있게 합니다.

결론getter와 setter는 자바스크립트에서 객체의 속성에 대한 접근과 수정 방식을 제어하는 강력한 도구입니다.

이를 통해 객체 지향 프로그래밍의 원칙인 캡슐화와 데이터 보호를 실현할 수 있으며, 코드의 가독성과 유지보수성을 높이는 데 기여합니다.

이러한 기능을 적절히 활용하면 더욱 견고하고 유연한 코드를 작성할 수 있습니다.