JSのコーディングについてご相談させて頂きます。
JSのコーディングでようやくES2015を本格的に取り入れようと本腰をあげました。
Javaも利用しており、JSでも普段からprototypeなどを利用した書き方をしていたので、class
の概念導入は当初特に問題なかったのですが、引数の受け渡し方法で悩んでいます。
class内のコンストラクタでプロパティをthisに紐付けて設定するかと思いますが、
class内でメソッドが他メソッドを呼ぶ時、以下受け渡し方法を想定しています。
- 通常通り引数で受け渡す
- thisにプロパティとして紐付け、渡したい先のメソッドでthisから参照する
当初前者で考えていたのですが、eslintがthisを利用していないメソッドに警告を出す
ことから、thisを参照するように作ったほうが良いのかと悩んでいます。
確かにAngularなどを使った時などに値を中央一括管理して画面に反映するように、なるべく
this内に集約した方が確かに良いような気もします。
またもう一件、class内でどのタイミングでもthisにプロパティを追加出来ることが
少し気持ち悪く感じておりますが、こんなものなのでしょうか。
出来れば感覚的にはJavaのプロパティ宣言のように、宣言したものだけしかプロパティ
設定出来ないようしたいと考えています。
コンストラクタ内でthisに紐付けたプロパティ以外、他メソッド追加出来ない
とかの制限は出来ないのでしょうか。
Objectの場合は、よく拡張禁止にObject.preventExtensionsを使っていたのですが…。
なお、本プロジェクトは残念ながらフレームワークの導入はしておりません。
現物のソースコードは投稿出来ないのですが、以下のようなイメージです。
javascript
1class Page { 2 constructor() { 3 // もろもろconstructorでプロパティ定義。 4 this.id = null; 5 this.name = null; 6 } 7 8 controller() { 9 this.getData(() => { 10 // 取得したデータの表示処理 11 draw(); 12 }); 13 } 14 15 getData(callback) { 16 // Ajaxでサーバーからデータ取得 17 const data = ~; 18 // 非同期についてはさておき、ajax通信後に以下が実行されるとします。 19 // 取得したデータをthisに紐付け 20 this.id = data.id; 21 this.name = data.name; 22 callback(); 23 } 24 25 draw() { 26 // this.idとthis.nameを画面描画 27 // 引数はなく、thisから参照します。 28 } 29} 30 31const page = new Page(); 32page.controller();
※テキストエディタにぱぱっと書いたものなので、書式のミスがあるかもしれません。
※なお、以上のソースは「thisにプロパティとして紐付け、渡したい先のメソッドでthisから参照する」のイメージです。
回答1件
あなたの回答
tips
プレビュー