jquery 之 extend的实现
function getOpt(target, obj1, obj2, obj3){
$.extend(target, obj1, obj2, obj3);
return target;
}
var _default = {
name : 'wenzi',
age : '',
sex : 'male'
}
var obj1 = {
name : 'obj1'
}
var obj2 = {
name : 'obj2',
age : ''
}
var obj3 = {
age : '',
sex : {'error':'sorry, I dont\'t kown'}
}
getOpt(_default, obj1, obj2, obj3); // {name: "obj2", age: "67", sex: {error: "sorry, I dont't kown"}}
extend:延伸,扩展,推广
1.将两种或更多对象的内容合并到一个对象
option={name:"wenzi",age:"25",sex:"male"}
var _default={name:"wenzi",age:"26",sex:"male",address:"地址"}
$.extend(_default,option);
得到的结果:_default={name:"wenzi",age:"25",sex:"male",address:"地址"}
可以看到若是option上设置了相同的{}中的属性 ,那么就会覆盖_default中的属性值,若是存在_default中没有的属性,就会合并到_default中,同理,若是传入多个参数,那么属性值永远是最后一个属性的值。
2.只有一个参数(必要参数),为jQuery扩展方法活属性
$.extend({
_name:"wenzi",
_getname:function(){return this._name}
})
jquery得到扩展:直接使用
$._name;
$._getname();
3.深度拷贝和浅度拷贝
//浅度拷贝
var obj={name:"wenzi",sex:"male"}
var obj1=obj;
obj1.name="bing";
console.log(obj.name)
obj和obj1指向了同一个地址,两者任何一个修改属性值时,另一个也会跟着变,这就是浅度拷贝。
//深度拷贝
var s="hello";
var t=s;
t="world";
console.log(s);
t对象并没有指向s的引用,而是实实在在的赋值一份新的对象给新的变量,t改变,s不会改变。
但是用getpt(_default,obj1,obj2,obj3);得到的_default值是{name:"obj2",age:"67",sex:{error:"sorry,i dont't kown"}}
此时若是 修改为 _default.sex.error='hello world' 那么obj3.sex.error="hello world" //这也是浅度拷贝
$.extend()也提供了深度拷贝的方法
var obj = {name:'wenzi', score:};
var obj1 = {score:{english:, math:}}
$.extend(true, obj, obj1);
obj.score.english = ;
console.log(obj.score.english); //
console.log(obj1.score.english); //
jquery 之 extend的实现的更多相关文章
- jquery.fn.extend与jquery.extend--(初体验二)
1.jquery.extend(object); 为扩展jQuery类本身.为类添加新的方法. jquery.fn.extend(object);给jQuery对象添加方法. $.extend({ a ...
- jQuery为开发插件提拱了两个方法:jQuery.fn.extend(); jQuery.extend();
jQuery为开发插件提拱了两个方法,分别是: jQuery.fn.extend(); jQuery.extend(); jQuery.fn jQuery.fn = jQuery.prototype ...
- jQuery的extend方法
jq中的extend在面试中经常会被问道,今天我总结一个下有关于extend的用法三种进行对比,可能不全,希望大家指点, 用法一: $.extend({}) ,为jQuery类添加方法,可以理解为扩 ...
- jQuery.extend和jQuery.fn.extend的区别【转】
解释的很有意思,清晰明了又有趣,转来分享下,哈哈哈 jQuery.extend和jQuery.fn.extend的区别,其实从这两个办法本身也就可以看出来.很多地方说的也不详细.这里详细说说之间的区别 ...
- jQuery原生框架中的jQuery.fn.extend和jQuery.extend
extend 方法在 jQuery 中是一个很重要的方法,jQuey 内部用它来扩展静态方法或实例方法,而且我们开发 jQuery 插件开发的时候也会用到它.但是在内部,是存在 jQuery.fn.e ...
- 理解jquery的$.extend()、$.fn和$.fn.extend()
jQuery为开发插件提拱了两个方法,分别是: jQuery.fn.extend(); jQuery.extend(); jQuery.fn jQuery.fn = jQuery.prototype ...
- 解读jQuery中extend函数
$.extend.apply( null, [ true, { "a" : 1, "b" : 2 } ] );//console.log(window.a); ...
- jQuery的extend方法的深层拷贝
一些东西长时间不用就忘了,比如这个jQuery的extend方法的深层拷贝,今天看单页应用的书的时候,看到entend第一个参数是true,都蒙了.也是,自己的大部分对jQuery的学习知识来自锋利的 ...
- jQuery.fn.extend(object) object中this的指向
看到下面的代码后,一下子懵逼了.这个this指向哪儿去了. jQuery.fn.extend({ check: function() { return this.each(function() { t ...
- jQuery中$.extend
$.fn是指jquery的命名空间,加上fn上的方法及属性,会对jquery实例每一个有效. 如扩展$.fn.abc(),即$.fn.abc()是对jquery扩展了一个abc方法,那么后面你的每一个 ...
随机推荐
- AspNetPager.dll 分页控件使用
今天在用.net 做网站的时候,用到了DATALIST,但是datalist 没有自带的分页控件,后来在网上找了好长时间,看了aspnetpager.dll这个控件,这个控件挺好用的.我把使用方法写出 ...
- 图片放大_css3
.flash_little_img{position:relative;}.flash_little_img{width:500px;height:333px;border:none; margin: ...
- (1.3)mysql 事务控制和锁定语句
(1.3)mysql 事务控制和锁定语句 lock table 参考转载自:https://www.cnblogs.com/kerrycode/p/6991502.html 关键词:mysql loc ...
- 007-spring cloud gateway-GatewayAutoConfiguration核心配置-RouteDefinition初始化加载
一.RouteDefinitionLocator 在Spring-Cloud-Gateway的GatewayAutoConfiguration初始化加载中会加载RouteDefinitionLocat ...
- vue中使用better-scroll实现滑动效果
1.安装:npm install better-scroll 2.引入:import BetterScrol from "better-scroll"; 1.滚动效果 better ...
- spring boot上传 下载图片。
https://blog.csdn.net/a625013/article/details/52414470 build.gradle buildscript { repositories { mav ...
- latex 转word
1:下载pandoc软件,支持多种文件格式互转. http://www.pandoc.org/installing.html#windows 2:下载zip包,解压,并将含有pandoc.exe的目录 ...
- input text文本框内部最后面放一个按钮
.ContSpan { border: 1px solid #; display: inline-block; } .ContSpan span { cursor: pointer; backgrou ...
- 7.10 Models -- Handling Metadata(处理元数据)
1. 随着从store中返回的records,你可能需要处理一些元数据.Metadata是伴随着特定model或者type的一种数据,而不是record. 2. 分页是使用元数据的一个常见的例子.想象 ...
- Ajax—web中ajax的常用方式
什么Web2.0的特点? 1:注重用户贡献度 2:内容聚合RSS协议(每小块都个性化,单独加载单独请求,不用全部刷新--Ajax) 3:更丰富的用户体验 Ajax的概念? "Asynchro ...