しろうと さんが書きました: ↑6年前
なぜメソッドを呼び出す際にthisを変数として宣言しなければいけなかったのでしょうか。
(const method = this; のところです。)
又、requestAnimationFrameのところで新たな関数としてそれを呼び出しているのも気になります。
=> を使ったアロー関数式の場合、this をそのまま使用できます。
const method = this; を削除し、
requestAnimationFrame(() => this.update());
としても構いません。
変数が必要なのは function式の場合です。
const method = this;
requestAnimationFrame(function() { method.update(); });
requestAnimationFrame の引数は、コールバック関数です。
コールバック関数はグローバル関数でなければなりません。
update はグローバル関数ではなく、Systemクラスのメソッドです。
メソッドの呼び出しには、そのメソッドを持つオブジェクトの
存在が必要です。
requestAnimationFrame(update); で、
updateメソッドを登録して、「後で呼び出してね」とお願いしても
呼び出すほうは、Systemオブジェクトの存在を知りません。
そこで、メソッドではないグローバル関数を式として新たに
用意したいのですが、それには function式とアロー関数式が
あります。
function式の this はグローバルオブジェクトなので、
this.update() と書いても、グローバル関数の update は
存在しないのでエラーになります。
アロー関数式は this を束縛しないので、その時点での this、
すなわち Systemオブジェクトになります。
オフトピック
送信前に、プレビューしましょう。
codeタグは、code = "JScript" ではなく、code=JScript にしてみてください。