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

  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;

  };