关于此的JavaScript

Question

I am confused about the way this behaves in some circumstances for example I have this code

var makeRequest=function(url,callback){

  var data=10; 

  callback(data);
};

var obj = {
  someValue: 20,
  loadData: function(data){
    var sum = this.someValue + data;
    alert(sum);
  },
  prepareRequest:function(){
    var url="http://someurl.com";

    makeRequest(url,obj.loadData);

  }
};

It makes a request let s say and it gets some data. The thing is when I call the function makeRequest with obj.loadData as parameter it gives an error. Can someone explain why it happens this? Why it doesn t behave the expected way when i call obj.prepareRequest() even tho the loadData method is attacked to obj object? I would appreciate any help. "This" keyword is really confusing.

Answer 1

At the point when you passed your loadData function as a parameter into makeRequest just think of switching ownership ... makeRequest now owns loadData so if there's any this keyword being used in loadData then it is referring to makeRequest not obj .

The way to maintain ownership or context is to use .bind()

loadData has no clue what this.someValue is because the context was changed

In your prepareRequest function add bind and good practice is to use this for oop purposes

Example

makeRequest(url,this.loadData.bind(this));

Hope this helps