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 相关文章推荐
替代window.event.srcElement效果的可兼容性的函数
Dec 18 Javascript
javascript两段代码,两个小技巧
Feb 04 Javascript
jquery ready(fn)事件使用介绍
Aug 21 Javascript
13个PHP函数超实用
Oct 21 Javascript
AngularJs Understanding the Controller Component
Sep 02 Javascript
浅析JS中常用类型转换及运算符表达式
Jul 23 Javascript
详解express + mock让前后台并行开发
Jun 06 Javascript
详解js获取video任意时间的画面截图
Apr 17 Javascript
vue实现分环境打包步骤(给不同的环境配置相对应的打包命令)
Jun 04 Javascript
解决Vue的文本编辑器 vue-quill-editor 小图标样式排布错乱问题
Aug 03 Javascript
JavaScript 中判断变量是否为数字的示例代码
Oct 22 Javascript
微信小程序向Java后台传输参数的方法实现
Dec 10 Javascript
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
农民和部队如何穿矿
2020/03/04 星际争霸
php把session写入数据库示例
2014/02/26 PHP
PHP中in_array的隐式转换的解决方法
2018/03/06 PHP
JavaScript 常用函数库详解
2009/10/21 Javascript
Three.js源码阅读笔记(物体是如何组织的)
2012/12/27 Javascript
滚动条响应鼠标滑轮事件实现上下滚动的js代码
2014/06/30 Javascript
通过实例理解javascript中没有函数重载的概念
2015/06/03 Javascript
利用JS实现点击按钮后图片自动切换的简单方法
2016/10/24 Javascript
使用typescript开发angular模块并发布npm包
2018/04/19 Javascript
jQuery实现参数自定义的文字跑马灯效果
2018/08/15 jQuery
nodejs中用npm初始化来创建package.json的实例讲解
2018/10/10 NodeJs
jquery实现动态添加附件功能
2018/10/23 jQuery
详解vue 兼容IE报错解决方案
2018/12/29 Javascript
js实现ajax的用户简单登入功能
2020/06/18 Javascript
vue 根据选择的月份动态展示日期对应的星期几
2021/02/06 Vue.js
Python中的getopt函数使用详解
2015/07/28 Python
Python使用遗传算法解决最大流问题
2018/01/29 Python
python Flask 装饰器顺序问题解决
2018/08/08 Python
解决每次打开pycharm直接进入项目的问题
2018/10/28 Python
pyshp创建shp点文件的方法
2018/12/31 Python
python运用pygame库实现双人弹球小游戏
2019/11/25 Python
python实现百度OCR图片识别过程解析
2020/01/17 Python
Python异常继承关系和自定义异常实现代码实例
2020/02/20 Python
Python编写memcached启动脚本代码实例
2020/08/14 Python
如何用Python 实现全连接神经网络(Multi-layer Perceptron)
2020/10/15 Python
基于HTML5 Canvas 实现商场监控实例详解
2017/11/20 HTML / CSS
几个Shell Script面试题
2014/04/18 面试题
什么是方法的重载
2013/06/24 面试题
最新的互联网创业计划书
2014/01/10 职场文书
绩效管理实施方案
2014/03/19 职场文书
给老师的一封感谢信
2015/01/20 职场文书
召开会议通知范文
2015/04/15 职场文书
文化苦旅读书笔记
2015/06/29 职场文书
解决linux下redis数据库overcommit_memory问题
2022/02/24 Redis
nginx rewrite功能使用场景分析
2022/05/30 Servers
使用 Koa + TS + ESLlint 搭建node服务器的过程详解
2022/05/30 NodeJs