Where is the best place for event callbacks? (anonymous or named)

Question

This is a bit of an obsession. But I'm trying to make my code base more consistent. In some places I make callbacks of my own function there, and in others I write them anonymously in the event listener.

I want a consistent way to do this.

Is this just a random design choice (flip a coin and choose one) or is there a better way to do this.

Here is the shortest example I could find.

NS.parsel({ Name: 'MSimOut', S: { Page: SPage, Storage: SStorage, AniFlipMediaPane: MSimMediaPane }, E: { signout_button: '#signout_button' }, init: function () { var self = this; // anonymous inline function, should I move out as a named function and call using bind? self.E.signout_button.addEventListener("click", function () { self.S.AniFlipMediaPane.run('mi_about'); self.S.Page.flip('sp'); self.S.Storage.clear(); }, false); }, // or give a name like this? clicked: function () { self.S.AniFlipMediaPane.run('mi_about'); self.S.Page.flip('sp'); self.S.Storage.clear(); } }); 

Answer 1

It depends on the context. For event handlers, I tend to leave it an anonymous function, especially if the function is small and there is an easy way to call the handler (EG: .click() in jQuery). This is a simpler and clearer way to write code.

On the other hand, if you have a very large function or it will be called explicitly from places other than an event handler, it might be cleaner to leave it as a named function.