日別アーカイブ: 2024/01/03

JavaScript prototype: static method

JavaScript Tips を更新しました。
JavaScript Tips – Paepoi

古くさいコードを書き直しだけならすぐ終わるんだけど。
無意味に class のコードを prototype で書いてみたりとか。

// ベースクラスのようなもの、ES5 表記なのは意図的です
var TestClassBase = function(num) {
    this._num = num;
}
TestClassBase.staticFunc = function() {
    console.log('staticFunc 呼び出し');
}
TestClassBase.prototype.instanceFunc = function() {
    console.log('num は '+ this._num + ' です');
}
 
// 継承のようなもの
var TestClass = function(num) {
    TestClassBase.call(this, num);
}
TestClass.prototype = Object.create(TestClassBase.prototype);
TestClass.prototype.constructor = TestClass;
// 静的メソッドは無理やり継承
for (var p in TestClassBase) {
    if (TestClass[p] === undefined) {
        TestClass[p] = TestClassBase[p];
    }
}
// 新たな定義
TestClass.prototype.getNum = function() {
    return '百倍すると ' + this._num * 100 + ' です';
}
  
// 直接定義したものはそのまま呼び出す
TestClass.staticFunc();
  
// prototype で定義したものは object 化してから呼び出す
var test = new TestClass(7);
test.instanceFunc();
//tc.staticFunc(); // インスタンス化すると静的関数は呼び出しできない
  
console.log(test.getNum());

こんなの。

MDN で見つけたコードでは静的メソッドが継承できなくて。
ネットを探しても「できません」としか見つからなくて。
実現させろよ、プログラミングってそういうものだろみたいな。

意地になって色々試してやっと実現、安全は保証しないけど。
別にいいよね、今は普通に class を使うはずだもんね。
わざわざ ES5 縛りでやった意味は別に無い、楽しかったわ。