如何打破异步回调中的一些逻辑？

Question

我正在尝试使用请求中的回调方法进行 api 调用，但我是 web 开发的新手，目前我被困在 async 上。我有以下工作，但我想打破一些逻辑。例如，这是目前正在运行的内容

const request = require('request');

class GetAllData{

    constructor(){
        this.loadData();
    }

    // Gets all data from api query that I'll need to build everything else I'll need
    data(callback){
        request({'url':`https://definitely/a/url.json`, 'json': true }, function (error, response, body) {
            callback(body);
        });
    }

    loadData(cmrUrl){
        console.log("loadData");
        this.data(function(result){ console.log(result.foo.bar)});
    }
}

var moreData = new GetAllData();

这行得通，我可以做我需要做的两件事，即记录一些结果，并对结果进行小计算。但是，如果我想将此逻辑分解为其他函数，则会出现一些错误。

const request = require('request');

class GetAllData{

    constructor(){
        this.loadData();

    // Member variables
        this._subsetOne;
        this._thingICalculated;

    // Function call to print data outside of the async call.
        this.printData(this._subsetOne, this._thingICalculated);
    }

    // Gets all data from api query that I'll need to build everything else I'll need
    data(callback){
        request({'url':`https://definitely/a/url.json`, 'json': true }, function (error, response, body) {
            callback(body);
        });
    }

    loadData(cmrUrl){
        console.log("loadData");

                    // Set a class member variable
                    // ERROR: 'this' is undefined
                    this.data(function(result){ this._subsetOne = result.foo.bar)};

            // Call a member function, which calculates something, and then sets a member variable.
            this.calculateSomething = result;
            console.log(result);


        };
    }

    // Function which takes in result from async call, then calculates something.
    set calculateSomething(result){
        this._thingICalculated = result + 1;
    }

    printData(x, y){
        console.log(x,y);
    }
}

var moreData = new GetAllData();

从我一直在阅读的内容来看，我遇到的问题很常见，但我仍然不明白为什么这不起作用，因为调用是异步的，我只是想设置一个变量，或调用函数。我假设有一些方法可以要求成员变量设置和函数调用来等待异步请求的完成？

---

修复一次尝试

const request = require('request');

class GetAllData{

    constructor(){
        this.loadData();
        this._subset;
    }

    // Gets all data from api query that I'll need to build everything else I'll need
    data(callback){
        request({'url':`https://definitely.a.url/yep.json`, 'json': true }, function (error, response, body) {
            callback(body);
        });
    }

    loadData(cmrUrl){
        console.log("loadData");
        this.data(function(result){ this._subset = result
        this.getSubset()}.bind(this));
    }

    getSubset(){
        console.log(this._subset);
    }
}

var moreData = new GetAllData();

子集最终未定义。

Answer 1

在构造函数中，您必须将任何使用this 的成员方法绑定到自身。所以在调用loadData之前：

this.loadData = this.loadData.bind(this);

似乎this.data 将在loadData 中获得自己的范围，这就是为什么this 在该函数内返回未定义的原因。因此，您还必须将 this.data 绑定到 this（您的类实例）。

对任何访问this 的方法执行相同的操作。问题是默认情况下经典的 JavaScript 函数具有未定义的范围。 Arrow functions 但是会自动继承调用者的作用域。