JQuery: Tham chiếu phạm vi bên ngoài trong khi gọi lại

Question

Tôi gặp sự cố với OO Javascript và gọi lại jQuery. Nếu bạn nhìn vào mẫu bên dưới, nó sẽ giải thích mọi thứ.

Làm cách nào để gọi hàm functionToCall() nằm sâu trong dấu chấm câu này.

function outerClass() { 
    this.functionToCall = function() { 
     //do something 
    } 

    this.someOtherFunction = function() { 

    this.aCoupleOfVariables1 = 2; 
    this.aCoupleOfVariables2 = "stuff"; 

    $.ajax({ 
     success: function() { 
     //How do I call functionToCall() right here 
     //TRIED: 
      functionToCall(); 
      this.functionToCall(); 
      that.functionToCall(); 
     } 
    }); 
    } 
} 

Answer 1

Bạn có thể vượt qua this như tùy chọn context-$.ajax():

$.ajax({ 
    context: this, 
    success: function() { 
     // Here, 'this' refers to the same object as in the caller. 
     this.functionToCall(); 
    } 
}); 

Answer 2

Có một tài liệu tham khảo địa phương với nó,

function outerClass() { 

    var self = this; 

    this.functionToCall = function() { 
    //do something 
    } 

    this.someOtherFunction = function() { 

    this.aCoupleOfVariables1 = 2; 
    this.aCoupleOfVariables2 = "stuff"; 

    $.ajax({ 
     success: function() { 
      self.functionToCall(); 
     } 
    }); 
    } 
} 

Answer 3

Bạn cần phải xác định that trong phạm vi bên ngoài.

function outerClass() { 
    var that = this; 

    // ... 

    $.ajax({ 
     success: function() { 
      that.functionToCall(); 
     } 
    }); 
} 

Answer 4

Bạn cần phải lưu trữ các tài liệu tham khảo cho các this value từ phạm vi cha mẹ:

var parentScope = this; 

và sau đó truy cập functionToCall qua đó đối tượng

parentScope.functionToCall(); 

Ví dụ:

function outerClass() { 
    var parentScope = this; 

    this.functionToCall = function() { 
     //do something 
    } 

    // ... 

    $.ajax({ 
     success: function() { 
      parentScope.functionToCall(); 
     } 
    }); 
} 

---

Một cách khác để thực hiện điều đó sẽ được sử dụng ES5 của .bind() để thiết lập giá trị cho this trong chức năng bên trong của bạn (-context)

$.ajax({ 
    success: function() { 
     // Here, 'this' refers to the same object as in the caller. 
     this.functionToCall(); 
    }.bind(this) 
}); 

Answer 5

Duy trì phạm vi chức năng trong biến cục bộ và sử dụng nó hoặc bạn cũng có thể sử dụng jquery proxy, trong đó bạn có thể chỉ định ngữ cảnh.

function outerClass() { 
    this.functionToCall = function() { 
     //do something 
    } 

    this.someOtherFunction = function() { 

    this.aCoupleOfVariables1 = 2; 
    this.aCoupleOfVariables2 = "stuff"; 


    $.ajax({ 
     success: $.proxy(function() { 
      this.functionToCall(); 
     }, this) 
    }); 
    } 
}