Jquery的扩展方法extend详解

今天研究了下Jquery的扩展方法extend。

1.extend(obj,item1,item2,item3...);

这段代码的含义是将src1,scr2等所有项合并到obj对象中,但是同样存在一个问题,这样合并会修改到obj的整个结构。

2.var result = $.extend({},item1,item2,item3...);

这个方法巧妙地运用了extend的特性 将一个空对象与所有item合并,并通过返回值的形式获取到一个新的对象。如下所示:

var result = $.extend({},{name:"zx",age:21},{name:"clt",sex:"man"});

输出结果为{name:"clt",age:21,sex:"man"},由此我们可以看出在合并中, 如果存在相同的属性名,则后者会覆盖前者。

3.接下来是我们通常在插件中会看到的,扩展jq类的静态方法。如下所示:

$.extend({say:function(){alert("hello");}});

这样就是将src合并到jquery的全局对象中,换句话说也就是扩展了整个jq类的静态方法,我们可以通过$.say()进行调用。

举一反三,既然可以扩展jq类,自然也能扩展我们的自定义对象。

例如:$.extend(obj,{say:function(){alert("hello");}});

我们可以自定义一个obj对象,然后扩展他的say方法,通过obj.say()调用。

4.$.fn.extend(say:function(){alert($(this).text());}})

在jq源码中,$.fn = $.prototype,也就是jq类的原型链,该方法将src合并到jquery的实例对象中去,需要一个实例化的jq对象才可以调用,如下所示:

通过$("#test").say()可以调用到扩展的say方法。

5.var result=$.extend( true or false, {},
{ name: "zx", location: {city: "上饶",county:"USA"} },
{ last: "clt", location: {state: "江西",county:"China"} } );

最后我们需要了解$.extend中的传参,第一个参数为ture or false,分别代表执行深拷贝 or 浅拷贝。结果如下所示:

{ name: "zx", location: {city: "上饶",county:"China",state:"江西"} ,last:"clt"}。

当传入false时,代表执行浅拷贝,结果如下所示:

{ name: "zx", location: {state: "江西",county:"China"} ,last:"clt"}。

通过观察结果,我们可以得到以下结论。当参数为ture时,即为深拷贝,当第一个对象的location与第二个location的值不一样时,前者会将后者中的值给覆盖,换而言之,当不同时,则会进行合并。

当参数为false时,子项location属性相同时,后者location的属性值会将前者的值给完全覆盖。

时间: 2024-08-10 00:00:28

Jquery的扩展方法extend详解的相关文章

JQuery中$.ajax()方法参数详解

url: 要求为String类型的参数,(默认为当前页地址)发送请求的地址. type: 要求为String类型的参数,请求方式(post或get)默认为get.注意其他http请求方法,例如put和 delete也可以使用,但仅部分浏览器支持. timeout: 要求为Number类型的参数,设置请求超时时间(毫秒).此设置将覆盖$.ajaxSetup()方法的全局设 置. async:要求为Boolean类型的参数,默认设置为true,所有请求均为异步请求. 如果需要发送同步请求,请将此选项

JQuery中$.ajax()方法参数详解 (转)

url: 要求为String类型的参数,(默认为当前页地址)发送请求的地址. type: 要求为String类型的参数,请求方式(post或get)默认为get.注意其他http请求方法,例如put和 delete也可以使用,但仅部分浏览器支持. timeout: 要求为Number类型的参数,设置请求超时时间(毫秒).此设置将覆盖$.ajaxSetup()方法的全局设 置. async:要求为Boolean类型的参数,默认设置为true,所有请求均为异步请求. 如果需要发送同步请求,请将此选项

jQuery的bind()方法用法详解

bind()方法用法详解: 此方法是使用比较频繁的方法之一,虽然在API手册上有着对方法的介绍,但是由于语言简短,例子不够详细,可能会造成不能够完全准确的掌握bind()方法的使用,下面就结合实例介绍一下此方法的使用. 语法格式: $(selector).bind(type,[data],function(eventObject)) 此方法可以为所有匹配元素的特定事件绑定事件处理函数,例如: <!DOCTYPE html> <html> <head> <meta

jQuery Mobile中jQuery.mobile.changePage方法使用详解

jQuery.mobile.changePage方法用的还是很多的.作为一个老手,有必要对jQuery mobile中实用方法做一些总结.系列文章请看jQuery Mobile专栏.jquery.mobile.changepage是过时的jQuery Mobile 1.4.0及将被删除在1.5.0.使用pagecontainer部件的change()法代替. 注意该方法是在内部使用的页面加载和转换作为一个结果,点击一个链接或提交表单时.跳转外部页面全部没有效果,必须是内部的DIV页面才有效果.

PHP exif扩展方法开启详解(亲测)

本节主要介绍了如何开启PHP exif扩展方法,主要在于对php.ini文件的修改 服务器配置说明: 1.在php.ini文件中找到;extension=php_exif.dll,去掉前面的分号 2.在php.ini文件中找到;extension=php_mbstring.dll,去掉前面的分号,并将此行移动到extension=php_exif.dll之前,使之首先加载*. 3.找到[exif]段,把下面语句的分号去掉. ;exif.encode_unicode = ISO-8859-15 ;

jQuery.extend()、jQuery.fn.extend()扩展方法示例详解

jQuery自定义了jQuery.extend()和jQuery.fn.extend()方法. 其中jQuery.extend()方法能够创建全局函数或者选择器, 而jQuery.fn.extend()方法能够创建jQuery对象方法. 例如: 复制代码代码如下: jQuery.extend({ showName : function(name){ alert(name) } }); jQuery.showName("深蓝"); jQuery.extend()除了可以创建插件外,还可以

JQuery中$.ajax()方法参数详解(转载)

type: 要求为String类型的参数,请求方式(post或get)默认为get.注意其他http请求方法,例如put和 delete也可以使用,但仅部分浏览器支持. timeout: 要求为Number类型的参数,设置请求超时时间(毫秒).此设置将覆盖$.ajaxSetup()方法的全局设 置. async:要求为Boolean类型的参数,默认设置为true,所有请求均为异步请求. 如果需要发送同步请求,请将此选项设置为false.注意,同步请求将锁住浏览器,用户其他操作必须等 待请求完成才

JQuery中$.ajax()方法参数详解 及 async属性说明

url: 要求为String类型的参数,(默认为当前页地址)发送请求的地址. type: 要求为String类型的参数,请求方式(post或get)默认为get.注意其他http请求方法,例如put和 delete也可以使用,但仅部分浏览器支持. timeout: 要求为Number类型的参数,设置请求超时时间(毫秒).此设置将覆盖$.ajaxSetup()方法的全局设 置. async:要求为Boolean类型的参数,默认设置为true,所有请求均为异步请求. 如果需要发送同步请求,请将此选项

【转载】JQuery中$.ajax()方法参数详解

    url: 要求为String类型的参数,(默认为当前页地址)发送请求的地址. type: 要求为String类型的参数,请求方式(post或get)默认为get.注意其他http请求方法,例如put和 delete也可以使用,但仅部分浏览器支持. timeout: 要求为Number类型的参数,设置请求超时时间(毫秒).此设置将覆盖$.ajaxSetup()方法的全局设 置. async:要求为Boolean类型的参数,默认设置为true,所有请求均为异步请求. 如果需要发送同步请求,请