JavaScript의 Class 정의 정리

모던한(?).. 즉 현대적인 Javascript에서는 클래스를 정의하기 위한 class 키워드를 제공하기는 하지만, 현재의 IE에서 아직도 지원하지 않아 나름대로의 class 정의 방식을 사용하고 있습니다. 웹 기반의 GIS 엔진인 FingerEyes-Xr도 이러한 class 정의 방식으로 개발 되었습니다. 수백여개의 클래스를 이 방식으로 정의해 왔음에도 새로운 클래스를 정의할라치면 기존에 만들어진 소스를 Copy 해서 Paste 해 고치는 것이 세련미 떨어져.. 직접 키보드로 한땀 한땀 입력하고자 정리해 봅니다.

먼저 클래스 정의하는 최소한의 구문입니다.

MyClass = Xr.Class({
    /* name: "MyClass", */ // optional

    construct: function () { /* 생성자 */ }
});

private 변수를 추가하는 구문입니다. 반드시 생성자 안에서 밑줄(_)로 시작해서 정의합니다.

MyClass = Xr.Class({
    construct: function () {
        this._privateVariable = 0;
    }
});

맴버 함수를 추가하는 구문입니다. private는 밑줄로 시작하고, public은 밑줄이 아닌 영문 소문자로 시작합니다.

MyClass = Xr.Class({
    construct: function () {},

    methods: {
        _privateFunction: function() { },
        publicFunction: function() { },
    }
});

클래스 차원에서 접근할 수 있는 static 변수 정의입니다. 아래와 같다면, MyClass.STATIC_VARIABLE의 값은 0이 됩니다.

MyClass = Xr.Class({
    statics: {
        STATIC_VARIABLE: 0
    },

    construct: function () {}
});

[ToDo] 상속, 인터페이스에 대한 내용은 추후 필요하면 그때 정리할 것

답글 남기기 응답 취소