2026년 상식닷컴 선정 식당 & 카페 리스트
최근에 오픈한 호텔을 찾는다면 살펴보세요

switchMap을 사용할 때 Observable을 정리하는 방법은?

_____
Q1: switchMap을 사용할 때 Observable을 정리(clean up)해야 하는 이유는 무엇인가요?
A1: switchMap은 내부적으로 새로운 Observable이 방출될 때마다 이전 Observable 구독을 자동으로 취소(unsubscribe)하여 메모리 누수와 불필요한 작업 실행을 방지합니다. 따라서 별도의 정리 코드 없이도 구독이 자동으로 정리됩니다.

---

Q2: switchMap을 사용할 때 이전 Observable이 어떻게 정리되나요?
A2: switchMap은 새로운 값이 방출될 때 내부에 구독 중인 이전 Observable에 대해 unsubscribe를 호출합니다. 이 과정에서 이전 Observable의 리소스가 해제되고, 구독이 종료됩니다.

---

Q3: switchMap 사용 시 개발자가 추가로 Observable을 정리해야 하나요?
A3: 일반적으로 switchMap은 내부적으로 구독을 관리하기 때문에 별도의 정리 코드는 필요하지 않습니다. 하지만 전체 구독에 대한 관리(ex. 컴포넌트 언마운트 시 전체 구독 해제 등)는 별도로 해야 합니다.

---

Q4: Angular 컴포넌트에서 switchMap을 사용할 경우 구독 정리는 어떻게 하나요?
A4: Angular에서 switchMap을 사용할 때는 컴포넌트가 파괴될 때 전체 구독을 해제하는 패턴이 권장됩니다. 예를 들어:
- `takeUntil` 연산자와 `Subject`를 함께 사용하여 컴포넌트 파괴 시 자동 종료
- `async` 파이프를 사용해 템플릿에서 자동 구독 및 정리

```typescript
private destroy$ = new Subject();

ngOnInit() {
source$
.pipe(
switchMap(value => innerObservable(value)),
takeUntil(this.destroy$)
)
.subscribe(result => { /* ... */ });
}

ngOnDestroy() {
this.destroy$.next();
this.destroy$.complete();
}
```

---

Q5: switchMap 내부 Observable에서 리소스 해제가 필요한 경우 어떻게 처리하나요?
A5: 내부 Observable을 생성할 때 `Observable.create` 또는 `new Observable`의 반환 함수에서 클린업 로직을 구현할 수 있습니다. 이렇게 하면 switchMap이 구독을 취소할 때 해당 클린업 함수가 호출됩니다.

```typescript
const innerObservable = (val) => new Observable(observer => {
const resource = acquireResource(val);

observer.next(resource.data);

return () => {
resource.release(); // 클린업
};
});
```

---

요약:
- switchMap은 내부적으로 이전 Observable 구독을 자동 취소(정리)함
- 별도의 클린업이 필요한 경우 Observable 생성 시 명시적 정리 함수 사용
- 전체 구독 관리는 `takeUntil`, `async` 파이프 등으로 별도 처리
- Angular 컴포넌트에서는 `ngOnDestroy`에서 구독 해제가 필수적임
switchMap을 사용할 때 Observable을 정리하는 방법은 주로 구독 해제(unsubscribe) 와 내부 Observable 자동 취소 기능을 이해하는 데서 출발합니다.

1. switchMap의 동작 원리 switchMap 연산자는 내부에서 새로운 Observable을 반환하며, 만약 소스 Observable에서 새로운 값이 방출되면 기존에 실행 중이던 내부 Observable 구독을 자동으로 취소(unsubscribe)합니다.

즉, 내부 Observable이 중첩되는 상황에서 가장 최신 Observable만 활성 상태로 유지하게 합니다.

이 특성 덕분에, 예를 들어 API 요청을 처리할 때 사용자가 빠르게 여러 번 요청을 할 경우 이전 요청들은 자동으로 취소되어 비효율적인 네트워크 요청이나 결과 처리 충돌을 방지할 수 있습니다.



2. Observable 정리(Teardown)의 필요성 RxJS에서 Observable을 구독할 때는 반드시 구독을 해제해줘야 메모리 누수나 원치 않는 데이터 흐름을 방지할 수 있습니다.

switchMap이 내부 Observable 구독을 기존 구독이 끝났을 때 자동으로 취소하더라도 외부 Observable(즉, switchMap을 포함한 전체 스트림)을 구독 해제하지 않으면 여전히 리소스가 점유된 상태일 수 있습니다.



3. Observable 정리 방법 - 외부 Observable 구독 해제 컴포넌트가 종료되거나 더 이상 데이터 흐름이 필요 없을 때(예: Angular 컴포넌트의 ngOnDestroy), switchMap을 포함한 전체 스트림의 구독을 반드시 취소해야 합니다.

보통 `subscription.unsubscribe()` 를 호출하거나, Angular에서는 `takeUntil` 연산자와 함께 `Subject`를 사용하는 방식으로 구독 해제를 관리합니다.

- 자동 정리 연산자 활용 `switchMap` 자체는 내부 Observable을 이전 것이 새 Observable로 대체될 때 자동 정리하므로 내부 Observable에 대해선 따로 취소 코드를 작성하지 않아도 됩니다.

하지만, 외부 스트림 구독은 반드시 직접 관리해야 하며, `takeUntil`, `first`, `take`, `unsubscribe` 등과 같은 방법으로 명시적으로 구독을 해제하는 것이 중요합니다.



4. 내부 Observable에서 추가적인 정리가 필요한 경우 내부 Observable이 네트워크 요청, 타이머, 이벤트 리스너 등 자원을 사용하는 프로세스를 포함한다면, 이 정리는 switchMap이 자동으로 처리하지만, 내부 Observable 생성 시 꼭 메모리 누수를 방지하도록 적절한 클린업 코드가 포함되어 있어야 합니다.

예를 들어 `Observable.create` 나 `new Observable()`로 커스텀 Observable을 만들 때 정리 함수를 명시적으로 반환합니다.



5. 요약하자면 - switchMap은 내부 Observable이 새로 발생하면 기존 내부 Observable을 자동으로 해제(구독 취소)하여 정리해준다. - 외부 Observable에 대한 구독은 반드시 별도로 해제해야 하며, 이를 위해 Angular Lifecycle Hook, `takeUntil`, Subscription 관리 등을 활용한다.

- Observable 생성 시 필요한 경우 정리 함수를 포함하여 소스에서 자원 해제를 구현한다.

이런 점들을 유념하면 switchMap을 사용할 때 내부 Observable은 안전하게 정리되고, 외부 Observable 역시 언제든 구독 해제로 리소스 누수를 방지할 수 있습니다.

작성자: 김지성 [비회원] | 작성일자: 1년 전 2025-05-25 12:51:57
조회수: 165 | 댓글: 0 | 좋아요: 0 | 싫어요: 0
내용이 부정확하다면 싫어요를 클릭해주세요.