javascript prototype - adding a callback

Question

I'm using the javascript revealing prototype pattern, and I want to add a callback. I'm trying something like:

  var Refinements = function () { };

  Refinements.prototype = function () {
    Init = function () {
      $('.btn').click(Callback);
    },
    Callback = function(){
      alert('default function');
    };
    return { Init: Init, Callback : Callback };
  }();


   var refinements = new Refinements();
   refinements.Callback = function(){ alert('new method'); };
   refinements.Init();

Essentially what I want to do is pass a callback into the object and raise that callback when an event occurs.

What problems are you having? What are you expecting this code to do that it doesn't? — Hunter McMillen
– Hunter McMillen, Commented Jul 20, 2012 at 19:03
I want the alert('new method') to fire on btn.click instead of the alert('default function'). — dhysong
– dhysong, Commented Jul 20, 2012 at 19:05
I would prefer a structure like this: jsfiddle.net/FUBxq/2 - keep the callback function private and overriding it in the init() looks much cleaner to me. — Christoph
– Christoph, Commented Jul 20, 2012 at 19:33
@Christoph - Yes, as long as it's not something that might need to be changed later, that would be cleaner. — Scott Sauyet
– Scott Sauyet, Commented Jul 20, 2012 at 20:25

Scott Sauyet · Accepted Answer · 2012-07-20 19:10:13Z

5

    Init = function () {
        var refinement = this;
        $('.btn').click(refinement.Callback || Callback);
    },

Fiddle

answered Jul 20, 2012 at 19:10

Scott Sauyet

50.9k5 gold badges57 silver badges111 bronze badges

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

1 Comment

Christoph Over a year ago

it would prefer keeping the callback private and overriding it in the init function: jsfiddle.net/FUBxq/2

heavysixer · Accepted Answer · 2012-07-20 19:12:27Z

1

var Refinements = function() {};

Refinements.prototype = function() {
  return {
    init: function() {
      $('.btn').click(this.callback);
    },
    callback: function() {
      alert('default function');
    }
  }
}();


var refinements = new Refinements();
refinements.callback = function() {
  alert('new method');
};
refinements.init();

answered Jul 20, 2012 at 19:12

heavysixer

2,06917 silver badges25 bronze badges

Comments

Hunter McMillen · Accepted Answer · 2012-07-20 19:13:23Z

1

When I separated out the prototype functions, and removed the return { Init: Init, Callback : Callback }; piece everything seems to work fine.

function Refinements() {}

Refinements.prototype.Init = function() {
    $('.btn').click(this.Callback);
};

Refinements.prototype.Callback = function() {
    alert('default function');
};


var refinements = new Refinements();
refinements.Callback = function(){ alert('new method'); };
refinements.Init();

http://jsfiddle.net/Qyhrb/8/

answered Jul 20, 2012 at 19:13

Hunter McMillen

61.8k25 gold badges124 silver badges176 bronze badges

Comments

IUnknown · Accepted Answer · 2012-07-20 19:57:48Z

1

Foobar = function() {
    this.callBack = function() {
        alert("Default method");
    };
}

Foobar.prototype = {
    Init: function() {
        var self = this;
        $(".btn").click(function() {
            self.callBack.call();
        });
    }
};

var foobar = new Foobar();
foobar.Init();
foobar.callBack = function() {
    alert("Boo!");
};

answered Jul 20, 2012 at 19:57

IUnknown

22.5k4 gold badges41 silver badges71 bronze badges

Collectives™ on Stack Overflow

javascript prototype - adding a callback

4 Answers 4

1 Comment

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

1 Comment

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related