프론트엔드 개발 · 심화
메모이제이션 캐시나 카운터를 클로저로 구현할 때, 시간이 지나면서 의도치 않게 메모리가 계속 점유되는 상황이 생길 수 있습니다. 클로저가 참조를 붙잡는 방식이 GC와 어떻게 상호작용하는지, 그리고 이를 어떻게 완화할 수 있을지 설명해주세요.
힌트 · 어떤 변수가 클로저 스코프에 살아남는지와, 더 이상 필요 없을 때 참조를 끊는 전략 관점에서 접근하세요.
클로저참조가비지 컬렉션메모리 누수약한 참조
모범답안
클로저가 외부 스코프의 변수를 참조할 때, 해당 변수는 클로저가 살아있는 동안 계속 메모리에 유지됩니다. 메모이제이션 캐시나 카운터처럼 클로저가 오래 유지되는 경우, 이 참조 때문에 불필요한 메모리가 점유될 수 있습니다.
가비지 컬렉터(GC)는 더 이상 접근할 수 없는 객체를 제거하지만, 클로저가 참조하는 변수는 접근 가능하다고 판단하여 GC 대상에서 제외됩니다.
이를 완화하려면, 더 이상 필요 없는 변수에 대한 참조를 명시적으로 끊어주는 것이 중요합니다. 예를 들어, 캐시의 경우 일정 시간이 지나거나 특정 조건이 되면 해당 항목을 제거하는 로직을 추가할 수 있습니다. 또한, WeakMap이나 WeakSet 같은 약한 참조를 활용하면 객체가 GC 대상이 될 때 자동으로 참조가 해제되도록 하여 메모리 누수를 방지하는 데 도움이 됩니다.
읽었다면, 이제 직접 답해볼 차례예요
패스잇 앱에서 이 질문에 말로 답하면 AI가 꼬리질문까지 이어가며 1:1 코칭합니다.
함께 보는 JavaScript 면접 질문
- JavaScript의 이터레이터(Iterator)와 제너레이터(Generator)에 대해 설명해주세요.
- JavaScript의 Proxy와 Reflect의 용도와 사용법에 대해 설명해주세요.
- for 루프 안에서 setTimeout 콜백이 모두 같은 값을 출력하는 고전적인 문제를 var로 작성했을 때 왜 발생하는지, 그리고 let으로 바꾸면 왜 의도대로 동작하는지를 블록 스코프와 클로저 캡처 관점에서 설명해주세요.
- 화살표 함수의 this와 일반 함수의 this는 결정 시점과 규칙이 다릅니다. 객체 메서드를 화살표 함수로 정의했을 때 흔히 발생하는 버그와, 반대로 콜백에서 화살표 함수가 유리한 경우를 각각 예를 들어 설명해주세요.