The extend of jquery source learning

The Extend method of jquery is often used in projects now, so let's look at its implementation.

Speaking of extend, we must first understand the $.extend and $.fn.extend function of jquery and the difference

jquery has two methods for developing plug-ins, namely:

1. JQuery.fn.extend ();

2. Jquery.extend ();

Although JavaScript does not have a clear concept of classes, it is possible to construct definitions of similar classes.

jquery is a well-encapsulated class, such as $ ("#btn1") that generates an instance of the jquery class, which is important to understand.

(1). Jquery.extend (object);　

It is to add a class method to the jquery class, which can be understood as adding a static method. Such as:

a.jQuery.extend({

　　min: function(a, b) { return a < b ? a : b; },

　　max: function(a, b) { return a > b ? a : b; }

});

jQuery.min(2,3); //  2 
jQuery.max(4,5); //  5

B. jquery.extend (target, Object1, [objectn]) extends an object with one or more other objects, returning the extended object .
var settings = { validate: false, limit: 5, name: "foo" }; 
var options = { validate: true, name: "bar" }; 
jQuery.extend(settings, options);

Results:settings == { validate: true, limit: 5, name: "bar" }

(2). JQuery.fn.extend (object);

What is $.fn?

$.fn refers to the jquery namespace, and the members on FN (method function and property) are valid for each jquery instance.

If you look at the jquery code, it's not hard to find.

Jquery.fn = Jquery.prototype = {

Init:function (Selector, context) {//....

};

The original Jquery.fn = Jquery.prototype.

So, it's an extension to Jquery.prototype, which is adding "member functions" to the jquery class. An instance of the jquery class can use this "member function".

For example, we want to develop a plugin, make a special edit box, when it is clicked, then alert the contents of the current edit box. You can do this:

$.fn.extend ({
doalertwhileclick:function () {
$ (this). Click (function () {
alert (This). Val ());
            });
      }       
});
$ ("#input1"). Doalertwhileclick ();//page:

$ ("#input1") is a jquery instance, and when it calls the Member method Doalertwhileclick, it implements the extension, which pops up the contents of the current edit each time it is clicked.

Jquery.extend = JQuery.fn.extend =function() {    varoptions, name, SRC, copy, Copyisarray, clone, Target= arguments[0] | |{}, I= 1, Length=Arguments.length, deep=false; //Handle a deep copy situation    if(typeoftarget = = = "Boolean"{//To determine if the first parameter is a Boolean deep=Target; If so, it proves that the target object is the second parameter, and the first argument is to determine if it is a deep copy.
        //Skip The Boolean and the targettarget = arguments[I] | | {}; I++; }    //Handle Case If Target is a string or something (possible in deep copy)    if(typeofTarget!== "Object" &&!jquery.isfunction (target)) { //must be object or function target= {}; }    //Extend JQuery itself if only one argument is passed    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(Nameinchoptions) {src=target[name]; Copy=options[name]; //Prevent Never-Ending Loop
//solve the problem of circular reference, for example: Var a ={};$.extend (A, {name:a}), if you do not do this, you will get a dead loop object (a{name:{name:{name:{...}}), add this, is not extended, a or {}
                if(target = = =copy) {                    Continue; }                //Recurse If we ' re merging plain objects or arrays
// If it is a deep copy, and the extension object's Name property value exists, and the extension object is an object argument (or an array), enter the IF statement
                if(Deep && copy && jquery.isplainobject (copy) | |(Copyisarray=jquery.isarray (copy))) ) {                    if(Copyisarray) {///If the extension object's Name property value is an array, enter the IF statement Copyisarray=false; Clone= src && jquery.isarray (src)?src: [];// ///If the target object's Name property value is an array, take this array, if not, take []}Else{Clone= src && jquery.isplainobject (src)?src: {};////If the target object's Name property value is an object argument, take the object argument, and if not, take the {}}//never move original objects, clone themtarget[name] =jquery.extend (deep, clone, copy);

Recursive invocation of extend, deep copy of the extension object's Name property value (object or array) to clone.

After the recursion is over, return clone, assign to the target element's Name property

This extends all the properties of the extension object into the target object.

// Don ' t bring in undefined values                Else if (Copy!== undefined) {                    = copy;    } }} // Return the modified object    return target;};

Citation: http://www.cnblogs.com/Dlonghow/p/4142034.html

Http://www.cnblogs.com/chaojidan/p/4145168.html

The extend of jquery source learning