前提・実現したいこと
ECMascript5水準で、本格的なクラスを作ってみようと思い、初めて作ってみたコードを実験してみたところ
JavaScript
1AAA = function (i, j, k) { 2 var i = i || 0; 3 var j = j || 1; 4 var k = k || 2; 5 6 var p = AAA.prototype; 7 p.out = function () { 8 console.log(i + j + k) 9 } 10} 11 12bbb = new AAA(3,4,5); 13ccc = new AAA(6,7,8); 14 15bbb.out();//21 16ccc.out();//21 17
このように、どちらも同じ結果になってしまうことが判明し、クロージャーを捨てて全ての変数を「this」で書き直して、out関数に引数を追加しました。また、thisの参照位置がクラスと関数で異なってしまうので、さらに「bind」と「call」を用いて出力まで可能にしたコードが以下のコードです。
JavaScript
1AAA = function (i, j, k) { 2 this.i = i || 0; 3 this.j = j || 1; 4 this.k = k || 2; 5 6 var p = AAA.prototype; 7 p.out = function (l) { 8 console.log(this.i + this.j + this.k + l) 9 } 10} 11 12bbb = new AAA(3,4,5); 13ccc = new AAA(6,7,8); 14 15//bindで実行 16NEObbb = bbb.out.bind(bbb); 17NEOccc = ccc.out.bind(ccc); 18NEObbb(1);//13 19NEOccc(1);//22 20 21//callで実行 22bbb.out.call(bbb,1);//13 23bbb.out.call(ccc,1);//22 24
これでも実際動くので、文法上の問題はないのですが、
「bind」と「call」を使ったやり方では、どちらも冗長な書き方になってしまいます。
「bind」の場合は、Function.prototype.bind() - JavaScript | MDN - Mozillaによると新しい関数を生成するそうなので、せっかくのプロトタイプ宣言(メモリ節約のつもり)が無駄になってしまいますし、「call」を使ったやり方も当初予定していた関数の後ろに「call(クラス名)」を必ず付けなくてはいけなくなってしまうので、それはそれで面倒です。
なんとか、見やすい記述になるように、
JavaScript
1bbb.out();//これで出力
できるようにしたいのですが、方法はないでしょうか?
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2018/10/05 16:27
2018/10/06 01:34 編集
2018/10/06 04:10
2018/10/06 04:33
2018/10/06 04:43 編集
2018/10/06 15:08
2018/10/06 15:15