JavaScript 에서 Prototype 객체를 사용해서 함수를 추가하는 이유?


자바스크립트로된 라이브러리 혹은 프레임웍 들을 살펴보다보면 눈엣 가시처럼 거슬리는 코드들이 보인다. 평소에 보지못한방식이라서 그럴 수도 있고, 워낙 고수들이 만들어놓은 자바스크립트 고유의 장점들을 살려서 작성해놓았기 때문일 수도 있다.

어쨌든 그중에 자바스크립트를 생성할때 네임스페이스를 구현하는 방법 등을 둘째 치더라도 (보면 그냥 이해가 되는 부분이기도 하니까) 왜 이런 라이브러리들은 프로토타입 객체를 통해서 함수들을 선언해 놓을까?

가장 큰 이유는 개인적인 생각에서는 메모리의 문제가 아닐까 한다. 물론 다른 이유도 많겠지만…

메모리의 측면에서 보기위한 예를 들면:

[CODE]

function mySample() {

var field1 = “test”;

var today = new Date();

this.todayis=function(){

alert(“Today is ” + this.today);

}

}

[/CODE]

위와 같은 함수가 있다고 생각해보자. 이때 todayis 라는 함수는 오늘 날짜를 alert 창으로 찍어서 보여줄 것이다.이런식으로 mySample 함수 생성 메소드 내부에 함수를 추가하는 방식을 사용하는 경우에는 mySample 객체의 인스턴스가생성될때 마다 매번 함수를 새로 만드는 형태가 된다. – 객체를 대량으로 만드는 경우에는 메모리 사용면에 있어서 취약할 수 있다.

이런 고려사항때문에 대부분 Prototype 객체를 사용해서 함수를 연결하는 형태를 취하고 있는 것으로 생각된다.
하지만 Prototype 을 사용하는 경우에 주의해야 하는 사항은 가비지 문제이다.

함수내부에 함수를 추가한 형태의 경우에는 내부적으로 클로저가 만들어진 경우인데 (클로저는 함수 내부에 또 다른 함수를 구현하는 경우에만 동작한다), 이때 생성 메소드에서 DOM 엘리먼트를 다루는 경우에는 함수의 지역 변수로 선언된 내용이 가비지 컬렉터에게 수집되지 않는 문제점이 발생할 수 있다.

쩝… 여러가지고 JavaScript 코드를 사용해서 뷰단에서 멋진 효과및 이벤트 처리를 위해서는 많은 고려해야할 사항이 있는 것 같다.