자바스크립트 메모리 누수와 어떻게 막아야 하는가?

이 포스팅은 에전 자바스크립트 메모리 관리법에 대한 2편입니다

1편은 http://dayzen1258.tistory.com/entry/%EC%9E%90%EB%B0%94%EC%8A%A4%ED%81%AC%EB%A6%BD%ED%8A%B8%EC%9D%98-%EB%A9%94%EB%AA%A8%EB%A6%AC-%EA%B4%80%EB%A6%AC%EB%B2%95을 보고 오시면 좀 더 이번 포스팅이 잘 읽힐것이라고 생각합니다 :)

1. 전역변수

자바스크립트에서는 전역 변수에 할당되는 변수는 GC에서 자동으로 삭제하지 않습니다 그렇기에 전역변수에서 할당된 변수는 메모리 누수로 이어집니다

browser에서는 window객체, Node js에서는 global객체가 됩니다 

var afunction = function a(number){
this.number = number;
}

afunction(10);

위의 afunction의 메소드를 보면 this에 할당되는 number의 값은 global객체 즉 전역변수에 할당됩니다

저 변수는 프로그램이 종료될때까지는 계속 메모리의 한구석에 존재하는것입니다

물론 하나의 전역변수가 있다면 상관은 없겠지만 저게 한두개가 아니라 몇십, 몇백, 몇천개라면 어떤 상황이 될까요?

만약 클라우드의 메모리가 정말 정말 부족하다면 out of memory현상이 일어날수도있습니다

그렇기에 전역변수의 사용을 피하는것이 좋으며 만약 사용을 하더라도 사용이 끝났다면 null로 할당을 해줘야 합니다

2. 잊혀진 타이머와, 콜백함수

Node.js에서는 이벤트 함수가 있습니다 하나의 이벤트함수를 등록한다면 그 지정된 이벤트함수는 따로 할당을 해주지않는다면 프로그램이 종료될때까지 이 이벤트를 메모리에 저장해둡니다 예시를 보시면 다음과 같습니다

var events = require('events')

events.on('log', () => {
console.log(1);
})

위의 이벤트 함수를 달고 

console.log(this);

를 출력해보면

위와 같은 로그가 전역변수에 _events에 log가 함수로 존재합니다

그렇기에 이벤트를 등록하고 사용이 종료된 뒤에는 removeListner를 호출해서 해당 이벤트를 꼭 삭제처리를 해주어야 합니다

3. 클로저

자바스크립트만의 고유한 특성중 하나인 클로저입니다

간단히 클로저란 무엇인가?에 대해서 알아보면 간단히 자신을 감싸고 있는 밖의 스코프에 접근할수있는 내부 함수를 의미합니다

다음 간단한 예제를 보시죠!!

function out() {
const a = "this is closure";

return function() {
console.log(a);
}
}

const input = out();
input(); // this is closure

const input = out();을 호출한 시점에서 out의 함수 내부의 변수 a의 값은 이미 함수 범위를 벗어나서 실제로는 없어야 하는값입니다

하지만 input을 호출한다면 이때 a의값은 실제 메모리에 저장되고 사용되기 때문에 너무 많은 클로저 사용은 실제 메모리의 누수를 유발할수있습니다