jQuery的实现原理的模拟代码 -4 重要的扩展函数 extend


Posted in Javascript onAugust 03, 2010

jQuery.fn.extend 提供了一个扩展机制,可以方便我们通过一个或者多个示例对象来扩展某个对象。如果没有指定被扩展的对象,那么将扩展到自己身上。

jQuery.extend 也可以通过 jQuery.fn.extend 使用, 在 jQuery 中使用很多,用来为一个目标对象扩展成员,扩展的成员来自于一系列参考对象。
这样,如果我们需要为 jQuery.fn 扩展成员 removeData,就可以这样进行。

jQuery.fn.extend( 
{ 
removeData: function( key ) { 
return this.each(function() { 
jQuery.removeData( this, key ); 
}); 
} 
} 
);

extend 的源码如下,因为比较简单,所以没有做太多的精简。
/// <reference path="jQuery-core.js" /> 
2 
3 
4 jQuery.extend = jQuery.fn.extend = function () { 
5 // copy reference to target object 
6 var target = arguments[0] || {}, i = 1, length = arguments.length, deep = false, options, name, src, copy; 
7 
8 // 深拷贝情况,第一个参数为 boolean 类型,那么,表示深拷贝,第二个参数为目标对象 
9 if (typeof target === "boolean") { 
deep = target; 
target = arguments[1] || {}; 
// skip the boolean and the target 
i = 2; 
} 
// 如果目标不是对象也不是函数 
if (typeof target !== "object" && !jQuery.isFunction(target)) { 
target = {}; 
} 
// 如果只有一个参数就是扩展自己 
if (length === i) { 
target = this; 
--i; 
} 
// 遍历所有的参考对象,扩展到目标对象上 
for (; i < length; i++) { 
// Only deal with non-null/undefined values 
if ((options = arguments[i]) != null) { 
// Extend the base object 
for (name in options) { 
src = target[name]; 
copy = options[name]; 
// Prevent never-ending loop 
if (target === copy) { 
continue; 
} 
// Recurse if we're merging object literal values or arrays 
if (deep && copy && (jQuery.isPlainObject(copy) || jQuery.isArray(copy))) { 
var clone = src && (jQuery.isPlainObject(src) || jQuery.isArray(src)) ? src 
: jQuery.isArray(copy) ? [] : {}; 
// Never move original objects, clone them 
target[name] = jQuery.extend(deep, clone, copy); 
// Don't bring in undefined values 
} else if (copy !== undefined) { 
target[name] = copy; 
} 
} 
} 
} 
// Return the modified object 
return target; 
};
Javascript 相关文章推荐
js实现的仿新浪微博完美的时间组件升级版
Dec 20 Javascript
Javascript实现禁止输入中文或英文的例子
Dec 09 Javascript
JavaScript设计模式之原型模式(Object.create与prototype)介绍
Dec 28 Javascript
jquery实现叠层3D文字特效代码分享
Aug 21 Javascript
javascript实现表单验证
Jan 29 Javascript
JavaScript原生节点操作小结
Jan 17 Javascript
Bootstrap导航条学习使用(一)
Feb 08 Javascript
jquery之基本选择器practice(实例讲解)
Sep 30 jQuery
video.js 一个页面同时播放多个视频的实例代码
Nov 27 Javascript
如何换个角度使用VUE过滤器详解
Sep 11 Javascript
详解小程序如何动态绑定点击的执行方法
Nov 26 Javascript
jQuery实现颜色打字机的完整代码
Mar 19 jQuery
jQuery的实现原理的模拟代码 -3 事件处理
Aug 03 #Javascript
SlideView 图片滑动(扩展/收缩)展示效果
Aug 01 #Javascript
JavaScript和ActionScript的交互实现代码
Aug 01 #Javascript
JavaScript判断窗口是否最小化的代码(跨浏览器)
Aug 01 #Javascript
jquery下onpropertychange事件的绑定方法
Aug 01 #Javascript
关于this和self的使用说明
Aug 01 #Javascript
ajax 缓存 问题 requestheader
Aug 01 #Javascript
You might like
php实现兼容2038年后Unix时间戳转换函数
2015/03/18 PHP
linux平台编译安装PHP7并安装Redis扩展与Swoole扩展实例教程
2016/09/30 PHP
用PHP的反射实现委托模式的讲解
2019/03/22 PHP
动态添加js事件实现代码
2009/03/12 Javascript
ParseInt函数参数设置介绍
2014/01/02 Javascript
javascript自定义滚动条实现代码
2020/04/20 Javascript
JS获取当前页面名称的简单实例
2016/08/19 Javascript
详解Angular2响应式表单
2017/06/14 Javascript
JavaScript判断变量名是否存在数组中的实例
2017/12/28 Javascript
jQuery实现遍历XML节点和属性的方法示例
2018/04/29 jQuery
AngularJS中ng-options实现下拉列表的数据绑定方法
2018/08/13 Javascript
AngularJS修改model值时,显示内容不变的实例
2018/09/13 Javascript
vue 点击展开显示更多(点击收起部分隐藏)
2019/04/09 Javascript
微信小程序数据统计和错误统计的实现方法
2019/06/26 Javascript
vue-router跳转时打开新页面的两种方法
2019/07/29 Javascript
antd-DatePicker组件获取时间值,及相关设置方式
2020/10/27 Javascript
Pandas 数据处理,数据清洗详解
2018/07/10 Python
Django渲染Markdown文章目录的方法示例
2019/01/02 Python
python实现微信定时每天和女友发送消息
2019/04/29 Python
python仿evething的文件搜索器实例代码
2019/05/13 Python
Django+uni-app实现数据通信中的请求跨域的示例代码
2019/10/12 Python
python3 字符串知识点学习笔记
2020/02/08 Python
基于CentOS搭建Python Django环境过程解析
2020/08/24 Python
全面解析CSS Media媒体查询使用操作(推荐)
2017/08/15 HTML / CSS
东方通信股份有限公司VC面试题
2014/08/27 面试题
计算机软件个人的自荐信范文
2013/12/01 职场文书
电气工程师岗位职责
2014/01/01 职场文书
和平主题的演讲稿
2014/01/12 职场文书
我的动漫时代的创业计划书范文
2014/01/27 职场文书
销售提升方案
2014/06/07 职场文书
大学教师师德师风演讲稿
2014/08/22 职场文书
幼儿园园务工作总结2015
2015/05/18 职场文书
起诉状范本
2015/05/20 职场文书
小学语文教学随笔
2015/08/14 职场文书
pytorch DataLoader的num_workers参数与设置大小详解
2021/05/28 Python
一篇文章学会Vue中间件管道
2021/06/20 Vue.js