I was looking at the jQuery plugins for Twitter Bootstrap and saw that they were all defined using a pattern like this:
!function($) {
// code here
// plugin definition here
} ( window.jQuery || window.ender);
This looks like a variation of the immediately executing anonymous function (anonymous closure):
(function($) {
// code here
}(jQuery));
Can someone explain what the Bootstrap variation does and why? Is this a better way to write an anonymous closure?
Thanks!
Bootstrap provides custom events for most plugins' unique actions. Generally, these come in an infinitive and past participle form - where the infinitive (ex. show ) is triggered at the start of an event, and its past participle form (ex. shown ) is triggered on the completion of an action. As of 3.0.
Bootstrap comes bundled with 12 jQuery plugins that extend the features and can add more interaction to your site. To get started with the Bootstrap's JavaScript plugins, you don't need to be an advanced JavaScript developer.
We can check Bootstrap-specific method is available or not. Syntax: var bootstrap = (typeof $(). "Bootstrap-specific method" == 'function');
Explanation: Bootstrap's JavaScript plugins, you don't need to be an advanced JavaScript developer. By utilizing Bootstrap Data API, most of the plugins can be triggered without writing a single line of code.
// |---1. makes the function as part of an expression
// | so it can be immediately invoked
// v
!function($) {
// ^
// |___4. references what was passed, window.jQuery or window.ender
// code here
// plugin definition here
} ( window.jQuery || window.ender); // <---2. immediately invoke the function
// ^ ^
// |________________|_______3. pass window.jQuery if it exists,
// otherwise window.ender
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With