JavaScriptをオブジェクト指向として書く

きっかけ

Google流 JavaScript におけるクラス定義の実現方法という記事をみて、確か２社目の会社でこんな感じの書き方をしていたなぁというのを思い出した。いいやり方だと思ったので、再びキャッチアップすべく、そして備忘録としてこの記事を書く。

はじめに

JavaScriptにはpublic,privateという概念がないが、この記事ではあえてその言葉を使う。

コンストラクタ

基本形

ClassName = function () {};

引数を与える場合

ClassName = function (arg1, arg3) {
    this._arg1 = arg1;//privateはアンダーバーで始める等、Pythonと同じような命名規則を設けておく
    this._arg2 = arg2;
};

内部定数

ClassName = function () {
    this._CONST_NAME = 1;
};

private関数

ClassName = function () {
    this._func_name1 = function(arg1){
        //色々な処理
    };
    this._func_name2 = function(){
        return this._func_name1(1);//同一クラスの他関数を呼び出す場合、thisをつける
    };
};

public関数

ClassName.prototype.public_func_name = function (arg1) {
    this._func_name1(1);
    var that = this;//JQueryの使用上、eachの中などではthisの意味合いが変わるため、中から内部変数などを実行したい場合はthatにthisを一時避難させておく。
    $.each(target_idxs,
        function (index, target_idx) {
            that._func_name2();
        }
     );
};

インスタンス生成

    a = ClassName();
    b = ClassName2(1); //コンストラクタで引数がある場合

継承

//おそらくいたるところからこのinherits　を参照することになると思われるので、共通js等に記述しておくと良い
var inherits = function(childCtor, parentCtor) {
  Object.setPrototypeOf(childCtor.prototype, parentCtor.prototype);
};

inherits(ChildClass, ParentClass);

継承した場合のコンストラクタ

var ChildClass = function(arg1){
    ParentClass.call(this, arg1);//親のコンストラクタを実行するにはcallを使い、第一引数にthisを指定する、Pythonっぽい。
};

親クラスのメソッドを実行する

ChildClass.prototype.func_name = function(){
    ParentClass.prototype.func_name.call(this);//同じようにcallを使い、第一引数にthisを指定する
};

最後に

そんな弊社ですが、もし興味がありましたら、Qiitaの弊社技術者ブログトップページの下の方から連絡いただけましたら嬉しいです。お待ちしています！