본문 바로가기
카테고리 없음

Javascript로 Class 좀 편하게 만드는 class 함수.

by 철이아부지 2014. 12. 9.

만들다  보니 기능이 좀더 정리가 되서..

이 포스트의 스크립트 보다는 다음 포스트에 있는 스크립트가 더 좋습니다.


javascript로 class를 만드는 방법은 여러가지가 있는데요.

결국 class는 function 이고 데이터와 함수를 내장한 객체를 반환하면 됩니다.


그런데 이게 만들때마다 자꾸 짜증나서.. ㅠㅠ 아예 Class 라는 class를 만들어 보았습니다.

생성자와 상속 기능을 제공합니다. (단일 상속만 지원합니다. 게을러서..)


function Class( classObj, parent ) {

return function() {

var obj = {};

if( typeof( parent ) == 'function') {

obj = parent.apply(parent, arguments);

}

for (var attr in classObj) {

                     if (classObj.hasOwnProperty(attr)) {

        obj[attr] = classObj[attr];

                     }

                }

if( typeof( obj.init ) == 'function') {

obj.init.apply(obj, arguments);

}

return obj;

}

}


사용하는 예제는 다음과 같습니다. Fruit 클래스를 선언해 보지요.

var Fruit = new Class({

name: '',

  // init 가 생성자 입니다.

init: function(name) {

this.name = name;

},

alertName: function() {

alert(this.name);

}

});


var apple = new Fruit('Apple');

apple.alertName();


상속하는 예제입니다. Fruit를 상속받은 Pear를 선언해보겠습니다.

var Pear = new Class({

color: '',

init: function(color) {

this.color = 'yellow';

},

alertColor: function() {

alert(this.color);

}

}, Fruit);



var pear = new Pear('Pear');    // Fruit의 생성자 호출 후 Pear의 생성자가 호출됨


pear.alertName();    // Fruit의 method 호출

pear.alertColor();    // Pear의 method 호출