Javascript prototypal inheritance prototype function call

Question

Have a question about calling one prototype function in another prototype function.

for instance lets say I have a basic slider with two prototype functions.

function Slider() {

}

Slider.prototype.transition = function() {

}

Slider.prototype.setTargets = function() {

}

What is the proper way of calling the setTargets function inside of the transition function so something like this:

Slider.prototype.transition = function() {
   this.target.fadeOut('normal', function() {
      // call setTargets?  
      this.setTargets(); // errors when i do this
   });
}

thanks for the help

Andreas Louv · Accepted Answer · 2012-07-20 21:38:30Z

1

If this.target is an jQuery Object the callback of fadeOut will be called with this as the DOMNode.

Do this instead:

Slider.prototype.transition = function() {
   var me = this;
   this.target.fadeOut('normal', function() {
      me.setTargets(); // <-- See me
   });
}

I have chosen the name ~~that~~ me for all my initialized references to this. I never used ~~that~~ me for DomNodes, etc. makes sence for me.

Please see comments for furture views on this point.

EDIT:

Acually i used me not that - Dont know what im thinking ?? !

And for comment:

Slider.prototype.transition = function() {
   var me = this;
   this.target.fadeOut('normal', function() {
      var domThis = this;
      me.setTargets(); // <-- See me
      setTimeout(function() {
          // Use domThis [Dom Node]
      }, 123);
   });
}

Or:

You can make a jQuery object of this:

      var $this = $(this);
      me.setTargets(); // <-- See me
      setTimeout(function() {
          // Use $this [jQuery Object]
      }, 123);

If you need the jQuery Object of this you can refer to: me.target

      me.setTargets(); // <-- See me
      setTimeout(function() {
          // Use me.target [jQuery Object]
      }, 123);

edited Jul 20, 2012 at 21:38

answered Jul 20, 2012 at 17:34

Andreas Louv

47.3k14 gold badges109 silver badges126 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

T.J. Crowder Over a year ago

+1 but ugh that. that makes no sense. self maybe... :-)

Scott Sauyet Over a year ago

some people don't like self either, for some good reasons. Maybe name it slider like in my answer.

jchamb Over a year ago

ran into another problem, with my references. I have a setInterval that i'm using to call the transition which screws up the this... how would I go about getting back to my reference of the slideshow.

Scott Sauyet · Accepted Answer · 2012-07-20 17:35:54Z

0

The fadeOut function is not called in the context of your slider object.

Slider.prototype.transition = function() {
    var slider = this;
    this.target.fadeOut('normal', function() {
        // call setTargets?  
        slider.setTargets(); // should work now.
    });
}

answered Jul 20, 2012 at 17:35

Scott Sauyet

50.9k5 gold badges57 silver badges111 bronze badges

Collectives™ on Stack Overflow

Javascript prototypal inheritance prototype function call

2 Answers 2

3 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related