博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
Jquery $.extend的重载方法详述
阅读量:5797 次
发布时间:2019-06-18

本文共 2523 字,大约阅读时间需要 8 分钟。

1 $.extend(result,item1,item2,item3,........)  -这个重载方法主要是用来合并,将所有的参数都合并到result中,并返回result,但是这样会破坏result的结构.代码展示:

        $(function () {
            var p1 = { name: "张三", age: 16, sex: "男" };             var p2 = { name: "李四", age: 22, sex: "女" };             var p3 = { name: "王五", age: 23, sex: "gay", height: "175cm" };             $.extend(p2, p3);             var tr = "" + p2.name + "" + p2.age + "" + p2.sex + "" + p2.height + "";             $('.table').append(tr);         });

结果为:王五 23 gay 175cm   从结果进行分析两者的结果进行了合并,相同属性结果为最后一个参数的属性值为准。不相同的进行合并,最后返回的p2结果集结构上(多了heigth属性)发生了改变。

2.$.extend({},result,item1,item2,item3,........)    -这个方法将合并之后的结果集存到了{}中,并返回,且不会破坏进行合并的两个集合的结构。

$(function () {            var p2 = { name: "李四", age: 22, sex: "女" };            var p3 = { name: "王五", age: 23, sex: "gay", height: "175cm" };            var result=$.extend({},p2, p3);            var tr = "" + result.name + "" + result.age + "" + result.sex + "" + result.height + "";            $('.table').append(tr);        });

结果为:王五 23 gay 175cm    从结果进行分析两者的结果进行了合并,相同属性结果为最后一个参数的属性值为准。不相同的进行合并,最终生成{}集合,此时的p2结果集结构并没有发生改变。

 

观察上面的结果发现

3.$.extend(bool,{},result,item1,item2,item3,........)  -这种情况常用于嵌套集合

当bool值为true时,两个集合之间的合并为深合并,因为p1,p2两个集合中的adress属性相同,但是adress还拥有子属性(而且两个集合的adress属性的子属性还不相同所以里面的子属性也按照外面的属性合并方法进行合并)这样的合并叫做深度合并  -前提是当bool值为true时。

$(function () {            var p2 = { name: "李四", age: 22, sex: "女",address:{ provice:"浙江",city:"湖州"} };            var p3 = { name: "王五", age: 23, sex: "gay", height: "175cm",address:{city:"杭州"} };            var result=$.extend(true,{},p2, p3);            var tr = "" + result.name + "" + result.age + "" + result.sex + "" + result.height + "" + result.address.provice + "" + result.address.city + "";           $('.table').append(tr);        });

 

结果为:王五 23 gay 175cm  浙江  杭州

当bool值为false时,两个集合之间的合并叫做浅合并,因为p2,p3两个集合中的adress属性相同,但是此时的adress还用子属性(而且两个adress属性的子属性还不相同)因为bool值为false,所有合并只进行到adress属性级别,他的子属性不进行合并。代码如下:

$(function () {            var p2 = { name: "李四", age: 22, sex: "女",address:{ provice:"浙江",city:"湖州"} };            var p3 = { name: "王五", age: 23, sex: "gay", height: "175cm",address:{city:"杭州"} };            var result=$.extend(false,{},p2, p3);            var tr = "" + result.name + "" + result.age + "" + result.sex + "" + result.height + "" + result.address.provice + "" + result.address.city + "";           $('.table').append(tr);        });

结果如下:王五 23 gay 175cm  undefined 杭州  -即p3集合的adress属性直接吧p2集合的adress属性覆盖掉了。

 

转载于:https://www.cnblogs.com/GreenLeaves/p/5626891.html

你可能感兴趣的文章
2019届高二(下)半期考试题(文科)
查看>>
【REDO】删除REDO LOG重做日志组后需要手工删除对应的日志文件(转)
查看>>
nginx 301跳转到带www域名方法rewrite(转)
查看>>
AIX 配置vncserver
查看>>
windows下Python 3.x图形图像处理库PIL的安装
查看>>
【IL】IL生成exe的方法
查看>>
network
查看>>
SettingsNotePad++
查看>>
centos7安装cacti-1.0
查看>>
3个概念,入门 Vue 组件开发
查看>>
没有JS的前端:体积更小、速度更快!
查看>>
数据指标/表现度量系统(Performance Measurement System)综述
查看>>
GitHub宣布推出Electron 1.0和Devtron,并将提供无限制的私有代码库
查看>>
Angular2, NativeScript 和 React Native比较[翻译]
查看>>
论模式在领域驱动设计中的重要性
查看>>
京东AI研究院何晓冬:将先进的技术和模型落地到产业
查看>>
国内首例:飞步无人卡车携手中国邮政、德邦投入日常运营
查看>>
微软将停止对 IE 8、9和10的支持
查看>>
微服务架构会和分布式单体架构高度重合吗
查看>>
如何测试ASP.NET Core Web API
查看>>