javascript - (function($) { })(jQuery) 的含义(例如，在 jQuery Enlightenment 书中)

Question

我喜欢《DOM 启蒙》这本书，并且想阅读 jQuery 的姊妹篇。 .

我之前使用过基本的jquery，如下所示，我理解它们..

$(document).bind(‘contextmenu’, function() {
    // do something
});

但是书中提到了如下内容......我不明白它是如何使用的？

(function($){
// Use $ alias worry-free of conflicts
alert('You are using jQuery ' + $().jquery );
})(jQuery)

Answer 1

console = $('#console');
console.append("<p>At the start of execution, does $ === jQuery? " +( ($ === jQuery)?"yes":"no")+ "</p>");
$ = function() {};
console.append("<p>After re-assignment, does $ === jQuery? " +( ($ === jQuery)?"yes":"no")+ "</p>");
(function($) {
  console.append("<p>Inside our IFFE, does $ === jQuery? " +( ($ === jQuery)?"yes":"no")+ "</p>");
})(jQuery);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="console"></div>

这是一个“立即调用函数表达式”——有时称为“IIFE”('iffy')；您将全局对象 jQuery 传递到 IIFE 中，它在其中绑定(bind)到名称 $ - 以防万一加载的其他脚本使用 $ 出于其自身目的。

看到有人使用相同的技术确保“未定义”没有被重新定义为除 ECMAScript undefined 之外的其他内容也并不罕见:

(function($, undefined) {
   // first argument, the global 'jQuery', bound to $
   // there is no second argument, so the ECMAScript built-in type 'undefined'
   // will be bound here to the name 'undefined'.
})(jQuery);