1.

function(arg){...}

这就定义了一个匿名函数,参数为arg ;


而调用函数时,是在函数后面写上括号和实参的!!

由于操作符的优先级,函数本身也需要用括号,即:


(function(arg){...})(param)

这就相当于定义了一个参数为arg的匿名函数,

并且将param作为参数来调用这个匿名函数 。


而(function($){...})(jQuery)则是一样的,

之所以只在形参使用$,是为了不与其他库冲突,

所以实参用jQuery 。


《=等价于=》

var fn = function($){...}

fn(jQuery);



2.

jQuery(function(){

。。。

});

全写为

jQuery(document).ready(function(){

。。。

});





$(function(){

...

});

全写为:

$(cocument).ready(function(){

...

});




3.

jQuery(function(){

...

});

用于存放操作DOM对象的代码,

执行其中代码时DOM对象已存在。

不可用于存放开发插件的代码,

因为jQuery对象没有得到传递,

外部通过jQuery.method也调用不了其中的方法(函数)。






(function(){

...

})(jQuery);

用于存放开发插件的代码,

执行其中代码时DOM不一定存在,

所以直接自动执行DOM操作的代码请小心使用。


[这样做可以创建一个作用域以保证内部变量与外部变量不发生冲突,比如$ jQuery 等jquery内部定义的变量。]

[(function($){})(jQuery) 这个写法主要的作用还是保证jquery不与其他类库或变量有冲突 首先是要保证jQuery这个变量名与外部没有冲突(jquery内部$与jQuery是同一个东西 有两个名字的原因就是怕$与其他变量名有冲突二jQuery与其他变量冲突的几率非常小)并传入匿名对象,匿名对象给参数起名叫做$(其实和jquery内部是一样的) 然后你就可以自由的在(function($){})(jQuery)里写你的插件而不需要考虑与外界变量是否存在冲突]



<!DOCTYPE HTML>
<html lang="en-US">
<head>
	<meta charset="UTF-8">
	<title></title>
	<script type="text/javascript" src="http://lib.sinaapp.com/js/jquery/1.9.1/jquery-1.9.1.js"></script>
	<script type="text/javascript">
		(function($){
			console.log("---- begin------");
		
			/**
				测试方法1
			*/
			$.methodOne = function(p){
				if(p == 1) {
					console.log("OK");
				} else {
					console.log("NO");
				}
				
				var result = addP(p);
				console.log(result);
				
				//还可以写方法
				function addP(p) {
					return p + "--- result ---";
				}
			}
			
			
			/**
				测试方法2
			*/
			$.tempMethod = {
				//加
				add:function(a,b){
					return a + b;
				},
				//减
				reduce:function(a,b) {
					return a - b;
				},
				//乘
				multiply:function(a,b) {
					return a * b;
				},
				
				//再一层
				three:{
					//加
					add:function(a,b,c){
						return a + b + c;
					},
					//减
					reduce:function(a,b,c) {
						return a - b - c;
					},
					//乘
					multiply:function(a,b,c) {
						return a * b * c;
					}
				}	
			};

		
		})(jQuery);
		
		$(document).ready(function(){
			
			//调用测试方法1
			$.methodOne(1);
			//$.methodOne(3);
			
			
			//调用测试方法2
			var a = 8;
			var b = 4;
			var c = 2;
			
			var result1 = $.tempMethod.add(a,b);
			var result2 = $.tempMethod.reduce(a,b);
			var result3 = $.tempMethod.multiply(a,b);
			
			var result4 = $.tempMethod.three.add(a,b,c);
			var result5 = $.tempMethod.three.reduce(a,b,c);
			var result6 = $.tempMethod.three.multiply(a,b,c);
			
			
			console.log("result1 : " + result1);
			console.log("result2 : " + result2);
			console.log("result3 : " + result3);			
			
			console.log("result4 : " + result4);
			console.log("result5 : " + result5);
			console.log("result6 : " + result6);

		});
	</script>
</head>
<body>
	
</body>
</html>