jQuery中 $.extend 和 $.fn.extend 解释

$.extend()

(1)第一种:拓展jQuery的全局(静态)函数的 方式;---》一个参数

例如:

$.extend({

  add : function(){

    alert("1");

  },

  miu : function(){

    alert("2");

  }

})

//此方式在jQuery对象本身;可以通过 jQuery.add(), jQuery.miu() 直接调用;

(2)第二种:对象合并,即可以实现某个函数的重载;---》多个参数

例如:

var a = {"a":1}, b= {"b":2};

var setting = $.extend({},a, b);

这样子setting = {"a":1, "b":2};

将对象a,b合并到setting中;如果{} 指定为某个指定函数,则可以改变此函数的结构;

-------------------------------------------------------------------------------------------

$.fn.extend()

(1)$.fn.extend(src) //该方法将src合并到jquery的实例对象中;

例如:$.fn.extend({

      hello : function(){

          alert("hello");

      }

    })

----将 hello合并到 jquery的实例对象中。

-----------------------------------------------------------------------------------------

×××××××××××××××××××××××××××××××××××××××××××××××××

例:$.extend({namespace:{}});//jQuery拓展一个namespace的命名空间

$.extend($.namespace, {hello:function(){alert(1);}}) //在namespace命名空间下增加hello函数

---------------------------------------------------------------------------------------------------------------

$.extend

extend(boolean,dest,src1,src2,src3...)

boolean为true为深拷贝,false相反;

 

extend(boolean,dest,src1,src2,src3...)

 


      第一个参数boolean代表是否进行深度拷贝,其余参数和前面介绍的一致,什么叫深层拷贝,我们看一个例子:

 

var result=$.extend( true,  {},  
{ name: "John", location: {city: "Boston",county:"USA"} },
{ last: "Resig", location: {state: "MA",county:"China"} } );

 


      我们可以看出src1中嵌套子对象location:{city:"Boston"},src2中也嵌套子对象location:{state:"MA"},第一个深度拷贝参数为true,那么合并后的结果就是: 

 

result={name:"John",last:"Resig",
location:{city:"Boston",state:"MA",county:"China"}}

 

 

 

       也就是说它会将src中的嵌套子对象也进行合并,而如果第一个参数boolean为false,我们看看合并的结果是什么,如下:

 

var result=$.extend( false, {},  
{ name: "John", location:{city: "Boston",county:"USA"} },
{ last: "Resig", location: {state: "MA",county:"China"} }
);

 


     那么合并后的结果就是:

 

  result={name:"John",last:"Resig",location:{state:"MA",county:"China"}}

 

 ------》以上后部分摘自:http://www.cnblogs.com/RascallySnake/archive/2010/05/07/1729563.html

 $.fn

jQuery.fn = jQuery.prototype

例如:

$.fn.add = funciton(x, y){

  return x + y;

}

//给每个jQuery实例 增加add方法。 //和 $.fn.extend({ add : function(x, y){ return x + y; }})类似

 

 

你可以拓展一个对象到jQuery的 prototype里去,这样的话就是插件机制了。

 

(function( $ ){
$.fn.tooltip = function( options ) {
};
//等价于
var tooltip = {
function(options){
}
};
$.fn.extend(tooltip) = $.prototype.extend(tooltip) = $.fn.tooltip
})( jQuery );

 

posted @ 2015-06-16 12:21  he0xff  阅读(271)  评论(0编辑  收藏  举报