JQuery中extend使用介绍


Posted in Javascript onMarch 13, 2014

Jquery中extend的扩展方法原型是:


1、extend(dest,src1,src2,src3...);
它的含义是将src1,src2,src3...合并到dest中,返回值为合并后的dest,由此可以看出该方法合并后,是修改了dest的结构的。如果想要得到合并的结果却又不想修改dest的结构,可以如下使用:

2、var newSrc=$.extend({},src1,src2,src3...)//也就是将"{}"作为dest参数。
这样就可以将src1,src2,src3...进行合并,然后将合并结果返回给newSrc了。
如下例:

var result=$.extend({},{name:"Tom",age:21},{name:"Jerry",sex:"Boy"})

那么合并后的结果
result={name:"Jerry",age:21,sex:"Boy"}
也就是说后面的参数如果和前面的参数存在相同的名称,那么后面的会覆盖前面的参数值。

3、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"}}
Javascript 相关文章推荐
javascript下数值型比较难点说明
Jun 07 Javascript
jQuery实现的网页左侧在线客服效果代码
Oct 23 Javascript
JS作为值的函数用法示例
Jun 20 Javascript
利用JS实现页面删除并重新排序功能
Dec 09 Javascript
JS中事件冒泡和事件捕获介绍
Dec 13 Javascript
JavaScript中创建对象的7种模式详解
Feb 21 Javascript
jQuery中用on绑定事件时需注意的事项
Mar 19 Javascript
jQuery实现base64前台加密解密功能详解
Aug 29 jQuery
微信小程序图片选择区域裁剪实现方法
Dec 02 Javascript
JavaScript 截取字符串代码实例
Sep 05 Javascript
Vue extend的基本用法(实例详解)
Dec 09 Javascript
JavaScript实现飞舞的泡泡效果
Feb 07 Javascript
js中用window.open()打开多个窗口的name问题
Mar 13 #Javascript
javascript获取浏览器类型和版本的方法(js获取浏览器版本)
Mar 13 #Javascript
利用try-catch判断变量是已声明未声明还是未赋值
Mar 12 #Javascript
jquery原创弹出层折叠效果点击折叠弹出一个层
Mar 12 #Javascript
jq实现酷炫的鼠标经过图片翻滚效果
Mar 12 #Javascript
jquery、js操作checkbox全选反选
Mar 12 #Javascript
网站繁简切换的JS遇到页面卡死的解决方法
Mar 12 #Javascript
You might like
用PHP制作静态网站的模板框架(二)
2006/10/09 PHP
php输出1000以内质数(素数)示例
2014/02/16 PHP
PHP防止表单重复提交的几种常用方法汇总
2014/08/19 PHP
使用PHPMailer实现邮件发送代码分享
2014/10/23 PHP
PHP GD库生成图像的几个函数总结
2014/11/19 PHP
Laravel 5框架学习之数据库迁移(Migrations)
2015/04/08 PHP
浅析PHP数据导出知识点
2018/02/17 PHP
google 搜索框添加关键字实现代码
2010/04/24 Javascript
jQuery表格插件ParamQuery简单使用方法示例
2013/12/05 Javascript
JS中使用Array函数shift和pop创建可忽略参数的例子
2014/05/28 Javascript
jQuery中clone()方法用法实例
2015/01/16 Javascript
javascript判断网页是关闭还是刷新
2015/09/12 Javascript
Javascript简单实现面向对象编程继承实例代码
2015/11/27 Javascript
JavaScript中误用/g导致的正则test()无法正确重复执行的解决方案
2016/07/27 Javascript
React Native实现简单的登录功能(推荐)
2016/09/19 Javascript
jQuery Ztree行政地区树状展示(点击加载)
2016/11/09 Javascript
vue实现ToDoList简单实例
2017/02/07 Javascript
bootstrap折叠调用collapse()后data-parent不生效的快速解决办法
2017/02/23 Javascript
使用BootStrap实现标签切换原理解析
2017/03/14 Javascript
ES5 ES6中Array对象去除重复项的方法总结
2017/04/27 Javascript
关于laydate.js加载laydate.css路径错误问题解决
2017/12/27 Javascript
Node.JS枚举统计当前文件夹和子目录下所有代码文件行数
2019/08/23 Javascript
Python基于有道实现英汉字典功能
2015/07/25 Python
Java及python正则表达式详解
2017/12/27 Python
python2与python3的print及字符串格式化小结
2018/11/30 Python
python用pandas数据加载、存储与文件格式的实例
2018/12/07 Python
对Python捕获控制台输出流的方法详解
2019/01/07 Python
使用matplotlib中scatter方法画散点图
2019/03/19 Python
如何通过python的fabric包完成代码上传部署
2019/07/29 Python
基于Python中isfile函数和isdir函数使用详解
2019/11/29 Python
如何使用Python发送HTML格式的邮件
2020/02/11 Python
美国知名的网上鞋类及相关服装零售商:Shoes.com
2017/05/06 全球购物
致铅球运动员广播稿精选
2014/01/12 职场文书
导游词之烟台威海蓬莱
2019/11/14 职场文书
原生JS实现飞机大战小游戏
2021/06/09 Javascript
ObjectMapper 如何忽略字段大小写
2021/06/29 Java/Android