在上两篇文章中,我们看到每次要通过 jQuery 的原型增加共享方法的时候,都需要通过 jQuery.fn 一个个进行扩展,非常麻烦,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 的源码如下,因为比较简单,所以没有做太多的精简。

 1 /// <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") {
10         deep = target;
11         target = arguments[1] || {};
12         // skip the boolean and the target
13         i = 2;
14     }
15 
16     // 如果目标不是对象也不是函数
17     if (typeof target !== "object" && !jQuery.isFunction(target)) {
18         target = {};
19     }
20 
21     // 如果只有一个参数就是扩展自己
22     if (length === i) {
23         target = this;
24         --i;
25     }
26 
27     // 遍历所有的参考对象,扩展到目标对象上
28     for (; i < length; i++) {
29         // Only deal with non-null/undefined values
30         if ((options = arguments[i]) != null) {
31             // Extend the base object
32             for (name in options) {
33                 src = target[name];
34                 copy = options[name];
35 
36                 // Prevent never-ending loop
37                 if (target === copy) {
38                     continue;
39                 }
40 
41                 // Recurse if we're merging object literal values or arrays
42                 if (deep && copy && (jQuery.isPlainObject(copy) || jQuery.isArray(copy))) {
43                     var clone = src && (jQuery.isPlainObject(src) || jQuery.isArray(src)) ? src
44                         : jQuery.isArray(copy) ? [] : {};
45 
46                     // Never move original objects, clone them
47                     target[name] = jQuery.extend(deep, clone, copy);
48 
49                     // Don't bring in undefined values
50                 } else if (copy !== undefined) {
51                     target[name] = copy;
52                 }
53             }
54         }
55     }
56 
57     // Return the modified object
58     return target;
59 };

jQuery 原理的模拟代码 -0 目录

转载于:https://www.cnblogs.com/haogj/archive/2010/08/03/1789779.html

jQuery 原理的模拟代码 -4 重要的扩展函数 extend相关推荐

  1. JavaScript——JQuery原理介绍及模拟

    翻了半天终于看到一个讲jQuery原理比较不错的了,具体详细内容可以看阮一峰的,写的也不错== ==================================================== ...

  2. android长截屏代码,android长截屏原理及实现代码

    android长截屏原理及实现代码 发布时间:2020-08-31 06:55:16 来源:脚本之家 阅读:158 作者:Android笔记 小米系统自带的长截屏应该很多人都用过,效果不错.当长截屏时 ...

  3. jQuery原理第五天

    addClass <!--* @Author: 码小余* @Date: 2020-06-27 08:23:36* @LastEditTime: 2020-06-27 08:26:43* @Fil ...

  4. jQuery原理第四天

    insertAfter 实现insertAfter需要用到原生JavaScript的nextSibling属性 元素.insertAfter.指定元素 ==>将元素添加到指定元素外部的后面 in ...

  5. jQuery原理第三天

    jQuery DOM操作 empty/remove <!--* @Author: 码小余* @Date: 2020-06-24 16:07:12* @LastEditTime: 2020-06- ...

  6. jQuery原理第一天

    jQuery原理 jQuery的基本结构 jQuery的本质是一个闭包 jQuery为什么要使用闭包来实现? ​ 为了避免多个框架的冲突 jQuery如何让外界访问内部定义的局部变量 ​ window ...

  7. 智能优化算法:海鸥算法原理及Matlab代码

    智能优化算法:海鸥算法原理及Matlab代码 文章导航 1. 算法原理 2. SOA算法流程 2.1 迁徙行为(exploration ability) 2.2 攻击行为(exploitation a ...

  8. 数据结构——环形队列的原理(模拟环形队列)

    数据结构--环形队列的原理(模拟环形队列) 知识点简要介绍: 队列:一种特殊的线性表,包含队列头.队列尾,只允许在队列头进行删除操作,在队列为进行删除操作 分类:     顺序队列.循环队列(环形队列 ...

  9. 强化学习教程(四):从PDG到DDPG的原理及tf代码实现详解

    强化学习教程(四):从PDG到DDPG的原理及tf代码实现详解 原创 lrhao 公众号:ChallengeHub 收录于话题 #强化学习教程 前言 在前面强化学习教程(三)中介绍了基于策略「PG」算 ...

最新文章

  1. 【Python】Pandas中的宝藏函数-rank()
  2. 【深度学习】近几年,关于基于Imagenet数据集图像分类的模型总结
  3. Xcode6中使用initWithTitle:title image:image selectedImage:自定义图片
  4. windows里面的批处理命令不停地处理同一条命令
  5. html 背景区域设置,HTML5 背景的显示区域实现
  6. Microsoft Operations Framework 4.0
  7. 算法训练 Bus Tour
  8. linux 查看c库版本号,C语言再学习 -- 查看版本及内核信息(转)
  9. hdoj6298:Maximum Multiple(找规律,总结)
  10. win7/win10 密码忘了?没关系,利用5次shift,9步轻松破解密码
  11. 机器人——人类工作和生活的助手(科普)
  12. elementUI Cascader 级联选择器 拼音模糊搜索
  13. Codeforces 918D MADMAX 图上dp 组合游戏
  14. 【飞桨PaddlePaddle】四天搞懂生成对抗网络(四)——CycleGAN的绝妙设计:双向循环生成的结构
  15. 前端实现Thing.js 3D模型展示Demo
  16. 分享Python采集的77个PHP整站程序源码
  17. movidius 神经计算棒 ncsdk windows 平台 支持 配置 教程
  18. VLOOKUP函数使用及注意事项
  19. UDT长度的含义是什么?
  20. 手把手带你去搭建一套OpenStack云平台

热门文章

  1. Map m=new HashMap()
  2. 【Python3_进阶系列_006】Python3-单例模式
  3. Centos7.3 安装Mysql5.7并修改初始密码
  4. LeetCode之283. Move Zeroes
  5. iicFPGA程序及仿真
  6. INADDR_ANY的理解
  7. View scrolly 正负问题
  8. 面试常问Handler 的问题合集
  9. 解决 aka com.chaozh.iReader:style/Theme.AppCompat.Light.NoActionBar) not found.
  10. Java 数字用二进制表示,以及原码,反码,补码、负数的二进制表示