jQuery的继承extend的方法实现的简单理解
2016-11-06 18:35
806 查看
这个版本是2.1版本首先上代码
jquery的代码确实严谨性相当的高,判断的相当清楚,最重要的就是for循环内的函数,首先判断了是否为空,然后for in 循环处理对每一个元素处理,判断元素的情况,进行递归调用。
本人不善于表达,方法里面解释都已经写上了
从代码上可以看出,extend的使用方法不止一种
首先介绍一下最简单的extend(object)方法,里面传入一个对象,是对jQuery或者jQuery.fn方法的扩展。
其次,有两个或者n个对象的情况下,$.extend(object,object1,object2,......),这种情况是对第一个对象的扩展,也是浅拷贝。
介绍最后一种,就是传的第一个值为boolean类型的值,true为深拷贝,false为浅拷贝,传入的只有一个对象的情况下就是对jQuery本身的扩展,如果大于一个对象就是对第一个对象的扩展,返回值将是扩展完的对象。
jQuery.extend = jQuery.fn.extend = function() { var options, name, src, copy, copyIsArray, clone, target = arguments[0] || {}, i = 1, length = arguments.length, deep = false; // Handle a deep copy situation 处理一个深拷贝的情况 if ( typeof target === "boolean" ) { deep = target; // skip the boolean and the target 跳过布尔值和目标 target = arguments[ i ] || {}; i++; } // Handle case when target is a string or something (possible in deep copy) 当目标是一个字符串或东西(可能在深拷贝)的情况下 if ( typeof target !== "object" && !jQuery.isFunction(target) ) { target = {}; } // extend jQuery itself if only one argument is passed 如果只有一个参数是通过扩展jQuery本身 if ( i === length ) { 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 plain objects or arrays 递归如果我们合并普通对象或数组 if ( deep && copy && ( jQuery.isPlainObject(copy)/*是否是一个纯粹的对象*/ || (copyIsArray = jQuery.isArray(copy))/*或者是一个数组*/ ) ) { if ( copyIsArray ) { //处理是数组情况下的拷贝 copyIsArray = false; clone = src && jQuery.isArray(src) ? src : []; } else { //处理是一个纯粹的对象情况下的拷贝 clone = src && jQuery.isPlainObject(src) ? src : {}; } // 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; //最后返回克隆对象 };
jquery的代码确实严谨性相当的高,判断的相当清楚,最重要的就是for循环内的函数,首先判断了是否为空,然后for in 循环处理对每一个元素处理,判断元素的情况,进行递归调用。
本人不善于表达,方法里面解释都已经写上了
从代码上可以看出,extend的使用方法不止一种
首先介绍一下最简单的extend(object)方法,里面传入一个对象,是对jQuery或者jQuery.fn方法的扩展。
其次,有两个或者n个对象的情况下,$.extend(object,object1,object2,......),这种情况是对第一个对象的扩展,也是浅拷贝。
介绍最后一种,就是传的第一个值为boolean类型的值,true为深拷贝,false为浅拷贝,传入的只有一个对象的情况下就是对jQuery本身的扩展,如果大于一个对象就是对第一个对象的扩展,返回值将是扩展完的对象。
相关文章推荐
- 一个最为简单的jquery 分页实现方法!可以用用于理解js分页的原理。
- jquery实现ajax提交表单信息的简单方法(推荐)
- 原生JS取代一些JQuery方法的简单实现
- jQuery简单实现iframe的高度根据页面内容自适应的方法
- jQuery简单实现iframe的高度根据页面内容自适应的方法
- 深入理解jquery中extend的实现
- javascript事件委托理解,jQuery .on()方法一步到位实现事件委托
- 很实用的jQuery事件 - toggle() 方法,简单实现显示隐藏的功能
- 深入理解jquery中extend的实现
- 利用jquery的attr方法一行代码实现的简单的图片切换效果
- 用Jquery方法实现的简单下滑菜单效果
- jQuery简单实现遍历单选框的方法
- 原生JS取代一些JQuery方法的简单实现
- Lua的系统学习(杂)_通过Lua调用C#方法(热更新最直观的原理理解)_简单的随机数实现
- javaScript和jQuery自动加载简单代码实现方法
- jQuery.extend克隆对象实现方法详解
- JQUERY常用效果简单实现方法淡入淡出,隐藏等
- jQuery简单实现向列表动态添加新元素的方法示例
- 原生js实现复制对象、扩展对象 类似jquery中的extend()方法
- 对象之间的继承之浅拷贝和深拷贝(jquery方法$.extend())