jquery skinning two-extend

jquery1.4 jquery1.4 Download

The jQuery1.4 is used here, why use 1.4 because 1.4 many features are relatively easy to analyze without adding them.

Extend can be said to be one of the most common functions of jQuery, with the exception of several functions of the core, almost all of which use extend for prototyping or static function expansion. Let's take a look at extend if you do this kind of work.

Jquery.extend = jquery.fn.extend = function ()  {// copy reference to  target objectvar target = arguments[0] | |  {}, i = 1, length = arguments.length, deep = false,  options, name, src, copy;// handle a deep copy situation     //  deep copy if  ( typeof target ===  "boolean"  )  {deep =  target;                             //  Fixed deep copy target =  arguments[1] | |  {};              //  fixed target//  skip the boolean and the target           If it is a deep copy   correction loop (skip the first parameter (0) and the target (1)) I&nbsP;= 2;}  Handle case when target is a string or something  ( Possible in deep copy)     //  ensure that the target element is an object and not a function, but can be a function object (new  function) if   ( typeof target !==  "Object"  && !jquery.isfunction (target)  )  {target = {};}  extend jQuery itself if only one argument is passed     //  is considered extended  jQueryif  ( length === i ) when only one of the extended objects is  { target = this;            //  correction  this  for Jquery--i;}     //  Traverse parameter for  ( ; i < length; i++ )  {//  Only deal with non-null/undefined values         //  traverse values that are not  null  (objects) if  (  (options = arguments[ i ])  != null )  {// Extend the base object             //  traverse the properties below this object for  ( name  in options )  {src = target[ name ];      Properties of the   //  target copy = options[ name ];     //  The property to copy// prevent never-ending loop                 //  prevent infinite Loop if  ( target === copy )  { Continue;}  recurse if we ' re merging object literal values or arrays                 //  deep Copy, and   copy  is an object or array                  /**                * deep =>  true                *  copy == true                 * copy =>  must be an absolute object   or  copy  is an array                  *                  */if  ( deep && copy  &&  ( jquery.isplainobject (copy)  | |  jquery.isarray (copy)  )  )  {                     /**                     *&nbspIf the target element and the element to be copied have the same  key  and are objects or arrays then return the target object's  key                     *  create a corresponding type to save the data                      */ var clone = src &&  ( jquery.isplainobject (src)  | |  jquery.isarray (SRC)  )  ? src: jquery.isarray (copy)  ? [] : {};//  Never move original objects, clone them                     //  copy target[for sub-items  name ] = jquery.extend ( deep, clone, copy );// don ' t bring  in undefined values                 //  is not a deep copy} else if  ( copy !== undefined )  {target[ name ] = copy;}}}  Return the modified objectreturn target;};

Here's a list of some of extend's usage manuals that describe

1, this is the most basic usage

var t = $.extend ({A: "123"}, {b: ' 456 '}); Console.log (t);//object {a: "123", B: "456"}

2. Deep copy

var o1 = {    txt:  "123",    a: {          ' a_text ':  ' A_text '     }};var o2 =  {    txt1:  ' 456 ',    b: {          ' b_text ':  ' 123 '     }};d Ebugger;var t = $.extend ( FALSE,O1,O2); t[' B ' [' B_text '] =  ' changed to text '; Console.log (t); Console.log (O1,O2);// ------------------ -----------Deep clone------------------------------------var o1 = {   txt:  "123",     a: {         ' a_text ':  ' a_text '      }};var o2 = {    txt1:  ' 456 ',     b: {         ' b_text ':  ' 123 '     }}; debugger;var t  = $.extend (TRUE,O1,O2); t[' B ' [' B_text '] =  ' changed to text '; Console.log (t); Console.log (O1,O2); 

We see that when the depth clone parameter is False, the extended object key is B and the element object key is the same reference as the one that points to B. So when I changed the clone back to the T value ' B_text ', the original object also changed.

Take a look at the case of deep cloning, when I changed the cloned object T value ' B_text ', the original object did not change.

3. Next look at the case for JQuery extension plugin

Jquery.extend = JQuery.fn.extend = function () {};

He has added extend functions for jQuery static functions and prototypes, so we just need to add an extension function to the prototype to write the plugin.

$.fn.extend ({tudou:function () {alert (' Hello Tudou ')}});

See how he works here, in fact the principle is very simple.

When the extended object is only one, it is treated as an extended jqueryif (length = = = i) {target = this; Fix this for jquery--i;}

When you only pass an object, he will point the extended target to the current this, so it is convenient to write the plugin.

All right, it's over.

jquery skinning two-extend