补充$.extend()
这里多谢某童鞋的提醒!说我的上篇随笔jquery插件开发的方式一还还可用于合并参数和深clone,虽然方式二中用了方式一做参数合并,但并未详细介绍,所以今天在此处做点补充!
一、合并参数
jquery的extend扩展原型:
1 | extend(arg,arg1,arg2,……); |
返回值未arg1,arg2……合并到arg。这里就有两种用法。
-
省略arg参数,则arg1,arg2……合并后返回。
1 2 3 4 5 6 7 8 9 10 11 12 | var results=$.extend({name: 'nick' },{sex: 'handsome' }); //那么,返回值为 results={name: 'nick' ,sex: 'handsome' }; 自定义arg参数,则返回自定义类型的arg。如: //这里定义arg为一个对象 var results=$.extend({},{name: 'nick' },{sex: 'handsome' }); //那么,返回值为arg对象 results={name: 'nick' ,sex: 'handsome' }; //这里定义arg为一个数组 var results=$.extend([],{name: 'nick' },{sex: 'handsome' }); //那么,返回值为arg数组 results=[name: 'nick' ,sex: 'handsome' ]; |
注意:
合并参数时,若$.extend()中参数的属性名冲突了,则后面的值会替换前面的值。
1 2 3 4 | //这里定义arg为一个对象 var results=$.extend({},{name: 'nick' ,sex: 'male' },{sex: 'handsome' }); //那么,返回值为arg对象。sex属性冲突,则后面的值handsome替换male results={name: 'nick' ,sex: 'handsome' }; |
二、clone
jquery的extend的clone为:
1 | $.extend(boolean,arg,arg1,arg2……); |
-
boolean为true时,深clone:
1 2 3 | var results=$.extend( true ,{},{user:{name: 'nick' ,love: 'money' },age:25},{user:{name: 'summer' ,like: 'car' },sex: 'handsome' }); //返回值 results={ "user" :{ "name" : "summer" , "love" : "money" , "like" : "car" }, "age" :25, "sex" : "handsome" }; |
-
boolean为false时(默认):
1 2 3 | var results=$.extend( false ,{},{user:{name: 'nick' ,love: 'money' },age:25},{user:{name: 'summer' ,like: 'car' },sex: 'handsome' }); //返回值 results={ "user" :{ "name" : "summer" , "like" : "car" }, "age" :25, "sex" : "handsome" }; |
亲们,注意到了麽?好好看看返回值!
注意:
- $.extend()用于clone时最好将boolean设为true。
- 由于jquery早期版本只有浅clone,不过后面的版本修复了,所以使用jquery cdn时尽量使用较高版本。
最后本想附上jquery相关源码,但不想浪费篇幅,建议大家在源码里搜索 jQuery.extend !
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步