Prototype Framework은 많은 것을 제공한다. 최근들어 갈수록 그 매력에 빠져들고 있다. 프로토타입이 느리다는 얘기도 많이 있고 여러 벤치마킹에서 그런 점이 드러나기도 하지만 자바스크립트 프레임웍의 시초격이라는 점에서 무시할 수는 없다고 생각한다.

어쨌든 프로토타입 프레임웍은 크게 편리함을 더해주는 유틸리티 함수들이 있고 클래스 사용을 위한 부분들이 있다. 둘은 그 성격면에서 상당히 다르다. 유틸리티 함수들이 사용법만 익히면 그냥 사용하면 되지만 클래스 부분은 아무래도 좀 만만치 않았고 OOP등 생각해야 할 것들이 많이 있었다. 이번에 프레임워크를 좀 적극적으로 사용하고 있고 유틸리티 함수는 물론이고 클래스 기능을 사용해 보려고 다방면으로 노력중이다.

자바스크립트는 상당히 유연성이 있기 때문에 객체라는 개념이 약간 모호한 느낌이 있다. function()을 그냥 쓸수도 있고 Object로 만들어서 쓸수도 있다. 상당히 엄격한 다른 언어에 비해서 자바스크립트의 러프함은 편하다고 할 수도 있지만 다른 면에서는 약간 혼란스럽기도 하다. 예시로 Function을 호출해서 사용한건지 객체로 만들어 사용한 건지는 소스를 뜯어봐야 알 수 있다.

그래서 프로토타입은 좀더 명시적인 클래스 및 OOP 구현을 위한 기능을 제공한다.


prototype.js에서 제공하는 클래스 생성 함수인 Class.create()이다. 이 부분은 특별한 기능이라기 보다는 선언부의 역할을 하고 있다. Example을 클래스로 사용할 꺼라는 것을 명시적으로 적어준 것이고 그렇게 함으로써 객체를 만들지 않고 Example();를 사용할 수 없다. (나도 처음 볼때는 펑션의 이런식으로하는 선언이 헷갈렸는데 일반적으로 쓰는 fucntion test() {} 같은 방식을 var test = fucntion() {}와 같이 써주어도 동일하다. 이부분에 대해선 나중에 다시한번 포스팅을...)
(사소한 부분이지만 클래스이므로 통상적인 파스칼방식의 표기법을 사용했다.)

위와 같은 선언부에 클래스라면 당연히 있는 생성자(Constructor)를 제공하고 있다.

var Example = Class.create();
 
Example.prototype =  {
    initialize: function(par) {},
 
    methods: function() {}
}

클래스 구현을 위한 구조이다. 선언부 아래 클래스구현부를 적어주면 된다. 여기서는 자바스크립트의 prototype기능을 사용한다. prototype는 확장의 개념을 제공해주는데 예를 들어 간단히 적어보면

var test;
test.prototype.loading = function() {}

와 같이 적어주면 test.loading(); 와 같은 형식으로 사용할 수 있게 된다. 즉 클래스에서 Example클래스에 뒤 이어올 변수 또는 함수를 확장시켜준 것이다.

처음으로 등장한 initialize는 생성자의 역할을 한다. 이 생성자는 반드시 있어야 한다. 선언안했다고 자동으로 해주지는 않는다. 그리고 생성자는 클래스의 이름과 동일하게... 라는 등의 규칙은 여기서는 적용되지 않고 initialize라는 이름을 고정으로 사용해야 한다. 생성자이기 때문에


라고 실행을 하면 자동으로 initialize()를 바로 실행시켜주고 보통 생성자가 하는 역할을 이 안에 구현해 주면된다. initialize()함수에 파라미터가 있다면 new Example(par) 과 같이 객체를 만들때 파라미터를 넘겨주면 initialize()함수가 파라미터를 받는다. 이렇게 생성하고 다른 함수들은 test.methods() 와 같이 사용하면 된다.(test로 Example의 인스턴스를 만들어줬으므로...)

동작자체만으로 본다면 굳이 이렇게 하지 않아도 가능은 하다. 하지만 명시적으로 클래스를 사용한다는 점과 이렇게 하면 객체를 만들지 않고는 사용할 수 없기 때문에 의도하지 않은 사용을 막을 수 있다는 점, 생성자를 통해서 init의 역할을 하는 함수 호출을 줄인다는 점 등 장점은 충분하다고 본다.