javascript - プロトタイプ的継承完全版

Kazuho@Cybozuさま、いつもありがとうございます。

Kazuho@Cybozu Labs: JavaScript の String 型を継承する

　結論から言うと、String 型も継承っぽいことができます。こんな感じ。

おかげでプロトタイプ的継承モデルの完全版が出来ました。

AtomicなObjectを継承

これは、以下のように包括的に出来ます。

var Atomic = function(C){
    var P = function(v){ this._v = v; };
    P.prototype = new C;
    P.prototype.valueOf  = function(){ return this._v.valueOf(); }
    P.prototype.toString = function(){ return this._v.toString(); }
    return P;
}

使うときはこんな。

var MyStr = Atomic(Str);
MyStr.prototype.x = function(n){
  var str = '';
  while (n--) str += this;
  return new MyStr(str);
};
var mystr = new MyStr("foobar");

しかし、このままではAtomicな場合とそうでない場合を分けなければなりません。

object()の拡張

そこで、object()を以下のように拡張します。

var object = function(obj, base) {
    var P;
    switch ( typeof(obj) ) {
    case "boolean":
    case "number":
    case "string":
        P = Atomic((base || obj).constructor);
        break;
    // case "array": typedof([]) is "object".
    case "object":
        P = function(){};
        P.prototype = (base || obj);
        break;
    default:
        return;
    };
    P.prototype.method = function(o, f){
        if (typeof(o) == "string"){
            P.prototype[o] = f;
        }else{
            for (var p in o){
                P.prototype[p] = o[p];
            }
        }
    }
    return new P(obj);
}

これで、どんなObjectに対しても、obj.method()を使ってメソッドを追加できます。

var mystr = object("foobar");
mystr.method('x', function(n){
  var str = '';
  while (n--) str += this;
  return new MyStr(str);
});

しかし、このままではSingleton Methodの追加しか出来ないことになります。やはり大々的に使うには

var MyStr = function(o){
  // constructor を定義
}
var mystr = new MyStr("foobar");
var double = mystr.x(2);

のようにしたいところです。

Fake Constructorの定義

このMyStr()の定義をどうすればよいでしょうか？こうすればよいのです。

var MyStr = function(o){
    var self = object(o);
    self.method({
        'x': function(n){
            var str = '';
            while (n--) str += this;
            return new MyStr(str);
        },
        /* 他のmethodもここで定義 */
    });
    return self;    
}

ここで注目して頂きたいのは、MyStr()はthisにはノータッチなことです。だからMyStr.prototype.x = function(){ /*... */ }は出来ません。しかし、その役割はself.method()が担っています。

あとは、

var mystr = new MyStr("foobar"); // 実はnewはあってもなくてもよい。
var double = mystr.x(2);

とすればいいわけです。

デモ

まとめると、こんな感じになります。

Boolean

var MyBool = function(o){ var self = object(o); self.method('not', function(){ // you need the valueOf() since this is always true. var bool = ! this.valueOf(); return new MyBool(bool); }); return self; } var bool = false; var mybool = new MyBool(false); alert(mybool.not()); // true alert(mybool.not().not()); // false alert(bool.not()); // TypeError

Number

var MyNum = function(o){ var self = object(o); self.method({ 'fact': function(){ var fact = 1; for (var n = this; n; n--) fact *= n; return new MyNum(fact); }, 'round': function(){ return new MyNum(Math.round(this)); } }); return self; } var num = 3.14; var mynum = new MyNum(3.14); alert(mynum.round()); // 3 alert(mynum.round().fact()); // 6 alert(num.fact()); // TypeError

String

var MyStr = function(o){ var self = object(o); self.method({ 'x': function(n){ var str = ''; while (n--) str += this; return new MyStr(str); }, 'escape': function(){ return new MyStr(encodeURIComponent(this)); } }); return self; } var str = '弾'; var mystr = new MyStr('弾'); alert(mystr.x(2)); // 弾弾 alert(mystr.x(2).escape()); // %E5%BC%BE%E5%BC%BE alert(str.x(2)); // TypeError

Array

var MyAry = function(o){ var self = object(o); self.method('collect', function(f){ var ary = []; for (var i = 0; i < this.length; i++) ary[i] = f(this[i]); return new MyAry(ary); }); return self; } var ary = [1,2,3,4,5]; var myary = new MyAry([1,2,3,4,5]); alert(myary.collect(function(e){return e*2}).join(",")); // 2,4,6,8,10 alert(ary.collect()); // TypeError

Object

var MyObj = function(o){ var self = object(o); self.method({ 'reverse': function(f){ var obj = {}; for (var p in this) obj[this[p]] = p; return new MyObj(obj); }, 'keys' : function(f){ var keys = []; for (var p in this) keys[keys.length] = p; return keys; } }); return self; } var obj = { 'foo':1, 'bar':2, 'baz':3 }; var myobj = new MyObj({ 'foo':1, 'bar':2, 'baz':3 }); alert(myobj.reverse().keys()); // 1,2,3, ... alert(obj.reverse()); // TypeError

なんか足にささってなかなか抜けなかった刺が抜けた気分です。

Enjoy!

Dan the Prototyper