jquery - Javascript object and this - Stack Overflow

admin管理员组

文章数量:1426092

function robot(robotId) {
  this.id = robotId;
  this.parts = new Array();

  this.collectParts = function() {
    $.getJSON('some/url', function(json) {
      for(i in json.responses) {
        this.parts = json.responses[i].parts;
      }
    });
  }
}

How do I actually assign this.parts?

function robot(robotId) {
  this.id = robotId;
  this.parts = new Array();

  this.collectParts = function() {
    $.getJSON('some/url', function(json) {
      for(i in json.responses) {
        this.parts = json.responses[i].parts;
      }
    });
  }
}

How do I actually assign this.parts?

• javascript
• jquery
• ajax
• this

Share Improve this question Follow edited Oct 21, 2011 at 2:45 mkly asked Oct 21, 2011 at 2:41 mklymkly 2,27322 gold badges1818 silver badges2323 bronze badges 2

• 1 Too many of the same response, so I'll leave a ment. There are a couple other ways you could fix this that don't involve a variable. One is the jQuery.proxy() method, which will return a function that will invoke your function but with the correct this bound. Another solution would be to use the jQuery.ajax() method instead, and set the context: parameter, which allows you to set the value of this in the callbacks. – user113716 Commented Oct 21, 2011 at 2:53
• 1 If you do use a variable, I'd place it inside the collectParts function. Doing this, or using the above approaches will let you place your collectParts method on robot.prototype, so you're not recreating the same function with every instance. – user113716 Commented Oct 21, 2011 at 2:59

Add a ment  | 

4 Answers 4

Sorted by: Reset to default 6

Assign a reference to this (when it's in the proper scope) to a variable and use that variable in the function which has changed the scope of this. In the modified version of your code below, robotInstance is the variable I've opted to use:

function robot(robotId) {
  var robotInstance = this;

  this.id = robotId;
  this.parts = new Array();

  this.collectParts = function() {
    $.getJSON('some/url', function(json) {
      for(i in json.responses) {
        robotInstance.parts = json.responses[i].parts;
      }
    });
  }
}

Edit: I had written this modification last night, then decided not to post it. But based on the ment to your question by @Ӫ_._Ӫ, I decided I'd show you the way I would write your code:

var robot = function( robotId )
{
  this.id = robotId;
  this.parts = [];
};
robot.prototype = {
  collectParts: function()
  {
    var robotInstance = this;

    $.getJSON(
      'some/url',
      function( json )
      {
        var i,
            responses = json.responses;
        for( i in responses )
        {
          if( Object.prototype.hasOwnProperty.call( responses, i ) )
          {
            robotInstance.parts = responses[i].parts;
          }
        }
      }
    );
  }
};

To access this inside jQuery functions, you need to assign it to another variable, for instance, self = this; then replace this with self.

You can capture "this" in a "that" variable so that it can be used inside the scope of the callback of your $.getJSON

function robot(robotId) {
  this.id = robotId;
  this.parts = new Array();
  var that = this;
  this.collectParts = function() {
    $.getJSON('some/url', function(json) {
      for(i in json.responses) {
        that.parts = json.responses[i].parts;
      }
    });
  }
}

Just assign this to another variable e.g that

function robot(robotId) {
  var that = this; 
  that.id = robotId;
  that.parts = new Array();

  that.collectParts = function() {
    $.getJSON('some/url', function(json) {
      for(i in json.responses) {
        that.parts = json.responses[i].parts;
      }
    });
  }
}

本文标签： jqueryJavascript object and thisStack Overflow