class内の onreadystatechange でスコープ外に値＆class関数を実行する方法

Question

URLの情報を獲得後にデータを処理しようとしています。
classの中でXMLHttpRequestを実行して、class内の関数へのアクセスにしました。

しかし、スコープの関係と思いますが、エラーが発生します。
また class変数への代入方法ができていないようです。

どのようにして、外部への値保存＆関数呼び出しを実行すればよいでしょうか？

よろしくお願いします。

class webreq = class {
    constructor( act, name, path) {
        this.act = null;
        this.url = null;
        this.itemJson = null;
    }

    getXhr(){
        console.log(this.url);
        var act = this.act; //引数はvarで渡しています

        let xhr= new XMLHttpRequest();
        xhr.open('GET', this.url, true);
        xhr.send();
        xhr.onreadystatechange = function() {

            // ここからスコープが変わるのだと思っています。
            if (xhr.readyState == 4 && xhr.status == 200) {
                let resText = xhr.response.toString();
                const matches = resText.match(/var initialData = (.*?);</script>/);
                if(matches){
                    resText = matches[1];

                    // ↓ class変数の代入ではなさそう
                    this.itemJson = JSON.parse(resText);
                }

                // this.act だとエラーになるので var act で受け取り
                if( act ){
                    // ↓ ここでエラーになります。
                    this.setListVideoData();
                }
            }
        }
    }
    setListVideoData () {
        //ここでいろいろデータ加工しています
    }
}

Comments

[m.ts10806]

全角スペースいっぱいありますが、これは？

[m.ts10806]

>// ↓ ここでエラーになります。
と書かれていますが、
class act =
ここでエラーになります。
手元のコードから何か変えてるんでしょうか。

[退会済みユーザー]

コードを貼り付けたときに整形するためにスペースを入れた時に全角スペースが入ったのだと思います。
classはもっと長いのですが、問題部分を抜き出しました。class act は不適切でした。修正します。

Answer 1

たぶんthisが指すものが変わるので確認してみてください。

    getXhr(){
        var self = this; // 
        console.log(this); // 
        console.log(this.url);
        var act = this.act; //引数はvarで渡しています

        let xhr= new XMLHttpRequest();
        xhr.open('GET', this.url, true);
        xhr.send();
        xhr.onreadystatechange = function() {
            console.log(this); // 

            // ここからスコープが変わるのだと思っています。
            if (xhr.readyState == 4 && xhr.status == 200) {
                let resText = xhr.response.toString();
                const matches = resText.match(/var initialData = (.*?);</script>/);
                if(matches){
                    resText = matches[1];

                    // ↓ class変数の代入ではなさそう
                    this.itemJson = JSON.parse(resText);
                    self.itemJson = JSON.parse(resText);
                    console.log(this,self); // 
                }

                // this.act だとエラーになるので var act で受け取り
                if( act ){
                    // ↓ ここでエラーになります。
                    self.setListVideoData();
                }
            }
        }
    }

Comments

[退会済みユーザー]

ありがとうございます！
解決しました。
自分自身を var で格納して引き渡すのはまったく思いつきませんでした。