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方法,那么后面你的每一个 ...
随机推荐
- libevent 网络IO分析
libevent 网络IO分析 Table of Contents 1. 简介 2. 简单使用与入门 2.1. 定时器-timeout 超时回调 2.2. 信号事件 2.3. 读取 socket 3. ...
- mysql 权限管理 记录
授权操作只能用root账号,其他账号都不行 创建一个mike账号 mysql'; Query OK, rows affected (0.08 sec) 查看是否创建账号 select * from m ...
- SQLyog恢复数据库报错解决方法【Error Code: 2006 - MySQL server has gone away】
https://blog.csdn.net/niqinwen/article/details/8693044 导入数据库的时候 SQLyog 报错了 Error Code: 2006 – MySQL ...
- SQL Expression Language Tutorial 学习笔记一
http://docs.sqlalchemy.org/en/latest/core/tutorial.html Google 翻译了一下 SQLAlchemy Expression Language, ...
- python图片处理(一)
python图片处理需要先在cmd里面安装Pillow pip install Pillow 一.图片的打开与显示 from PIL import Image img=Image.open('d:/d ...
- mysql buffer
php与mysql的连接有三种方式,mysql,mysqli,pdo.不管使用哪种方式进行连接,都有使用buffer和不使用buffer的区别. 什么叫使用buffer和不使用buffer呢? 客户端 ...
- bootstrap3中关于布局的两种样式
container:用.container包裹的内容即可实现居中对齐.注意,由于在各分辨率下面都设置了padding 和 固定宽度,.container不能嵌套.row:栏栅系统是把父容器平均分为12 ...
- 【VS Hacks】定制VS
# Hack 24 定制快捷键 VS能够做很多键盘的配置,其实在VS中目前已经发现有很多的快捷键了,但是在这个技巧篇里会学到如何创建新的快捷键,以及编辑已有的快捷键.VS中包含很多的命令,只有其中 ...
- Python消息队列工具 Python-rq 中文教程
原创文章,作者:Damon付,如若转载,请注明出处:<Python消息队列工具 Python-rq 中文教程>http://www.tiangr.com/python-xiao-xi-du ...
- Python 运算符与基本数据类型
一.运算符 1.算数运算: 2.比较运算: 3.赋值运算: 4.逻辑运算: 5.成员运算: 二.基本数据类型 1.空(None) 表示该值是一个空对象,空值是Python里一个特殊的值,用None表示 ...