jQuery(function(){...})与(function($){...})(jQuery)的“兄弟”情结

记得那时在学习写基于jQuery的插件时，了解到(function($){...})(jQuery)的代码结构，一开始还没发觉，后来百度了解它的语意时，从搜索结果中发现了jQuery(function(){...})，当时就懵逼了（只知道$(function(){}) 23333）。后面通过别人的回答和博客逐渐了解清楚了，今天突然又看到了这个，概念又有些模糊了，恰有时间自己也来总结一下。

本文有些标题党了，其实这两个小东西并不能算兄弟，只不过是长的有些像而已。

1、jQuery(function(){...}):

用过jQuery的人应该都熟悉它真正的兄弟$(function(){...})【完整版：jQuery(document).ready(function(){...})】,表示在DOM（文档对象模型）加载好之后对DOM节点进行相应的操作。

2、(function($){...})(jQuery):

这其实是定义一个匿名函数function($){...}，然后立即传入实参jQuery执行该函数。由于操作符的优先级，所以给匿名函数加上括号，之所以只在形参处使用$，而实参处使用jQuery，是为了避免与其他库中的$冲突。

为了便于理解，可以将上述语句拆分一下：

var fn = function($){
        //code
        ....
};
fn(jQuery);//调用函数fn

注意，拆分只是为了方便理解，不是真的存在fn函数。在使用时为了方便和简化代码，将之压缩为(function($){...})(jQuery)，它的作用可以理解为预定义一些函数（方法），在写基于jQuery的插件时，经常会用到。