Javascript：从ajax成功设置类属性

Question

我有一个名为Spotlight的“类”/函数。我正在尝试通过ajax检索一些信息并将其分配给Spotlight的属性。这是我的Spotlight课程：

function Spotlight (mId,mName) {
    this.area = new Array();

    /**
     * Get all area information
     */
    this.getArea = function () {

        $.ajax({
            url: base_url +'spotlight/aGetArea',
            type: 'POST',
            success: function (data) {
                this.area = data;
            }
        });
    }
}

我已经将对象分配给一个数组，并且很难从Spotlight中获取它，所以我希望使用“this”访问所有内容。虽然成功函数在类之外，但我不知道如何在类中创建它。

有没有办法使用this.area而不是Spotlight.area将数据导入类属性？

Answer 1

这个值取决于每个函数的调用方式。我看到了解决这个问题的三种方法：

1。为此

创建别名

var that = this;
this.getArea = function () {
    $.ajax({
        url: base_url +'spotlight/aGetArea',
        type: 'POST',
        success: function (data) {
            that.area = data;
        }
    });
};

2。使用jQuery .ajax context选项

this.getArea = function () {
    $.ajax({
        url: base_url +'spotlight/aGetArea',
        type: 'POST',
        context : this,
        success: function (data) {
            this.area = data;
        }
    });
};

3。使用绑定函数作为回调

this.getAreaSuccess = function (data) {
    this.area = data;
};
this.getArea = function () {
    $.ajax({
        url: base_url +'spotlight/aGetArea',
        type: 'POST',
        success: this.getAreaSuccess.bind(this)
    });
};

Answer 2

好Spotlight.area无论如何都行不通。您只需要保留外部this：

this.area = [];
var theSpotlight = this;

然后在回调中：

  theSpotlight.area = data;

Answer 3

当在成功函数内部时，此对应于成功函数的范围。

function Spotlight (mId,mName) {
    this.area = [];
    var scope = this;

    /**
     * Get all area information
     */
    this.getArea = function () {

        $.ajax({
            url: base_url +'spotlight/aGetArea',
            type: 'POST',
            success: function (data) {
                scope.area = data;
            }
        });
    }
}