jquery Source code Analysis: JQuery extension method Extend detailed

The method or property to be extended in jquery is implemented through the Extend method. The so-called jquery plugin is also implemented through the Extend method.

The jquery.extend extension is a tool method, also known as a static method. The jQuery.fn.extend extension is an instance method.

When only one object is passed in, the methods and properties inside are extended to this. Like what:

$.extend ({aaa:function () {}, Bbb:function () {}}), where this is $, is called in this form $.aaa ().

$.fn.extend ({aaa:function () {}, Bbb:function () {}}), here This is $.fn (prototype), so in this form $ (""). AAA () call.

When multiple objects are passed in, subsequent objects are extended to the first object. Like what:

var a ={};

$.extend (A, {name: "Hello"}, {age:30}), at which point A = {name: "Hello", age:30}

Deep and shallow copies can also be made (copy inheritance). Like what:

var a = {};var b = {name:{age:30}};

$.extend (A, b); A.name.age = 20, when you print B.name.age, you will find also 20. This is a shallow copy. The object is not copied, only the simple characters are copied (if name is a string, then the value of a.name is changed, even a shallow copy does not affect the value of b.name). But you can use a deep copy:

$.extend (True, A, b); A.name.age = 20, when you print B.name.age, you will find that it is 30, no change. Because a deep copy, no matter what the properties of B, it will be copied again.

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

var options, name, SRC, copy, Copyisarray, clone,
target = Arguments[0] | | {},
i = 1,
Length = Arguments.length,
Deep = false; //default to shallow copy

if (typeof target = = = "Boolean") { //See if the first parameter is a Boolean
Deep = target; //If yes, the target object is the second argument, the first argument is to determine if it is a deep copy
target = Arguments[1] | | {};
i = 2;
}

if (typeof target!== "Object" &&!jquery.isfunction (target)) { //Must be an object or function
target = {};
}

if (length = = = i) { //If there is only one object, the target object points to this and extends the methods and properties on this
target = this;
I.;
}

for (; i < length; i++) {
if (options = arguments[i]! = null) { //To determine the extended object is not null
for (name in options) { //Fetch property name in Object
src = target[name]; //Take the Name property value of the target object
copy = options[name]; //Fetch the extension object's Name property value

if (target = = = copy) {

　　　　　　　　　　　　　Solve the problem of circular reference, such as: Var a ={};$.extend (A, {name:a}), if you do not do this, you will get a dead loop of the object (a{name:{name:{name:{...}}), add this, will not expand, a or { }
Continue
}

if (deep && copy && jquery.isplainobject (copy) | | (Copyisarray = Jquery.isarray (copy))) ) {

　　　　　　　　　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 (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 { //If the extension object's Name property value is an object argument
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 {}
}

target[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.

} else if (copy!== undefined) {
target[name] = copy;
}
}
}
}

return target;

}

In jquery, copy inheritance is used.

Come on!

jquery Source code Analysis: JQuery extension method Extend detailed