Read jQuery Part 2 (Two Extensions)_jquery

As follows

Copy the code The code is as follows:

jQuery.extend = jQuery.fn.extend = function () {
...
};

We can use $.extend to extend custom objects, such as

Copy code The code is as follows:

var myself = {name:jack};
$.extend(myself, {setName: function(n) {this.name=n;} });
myself.setName("tom");

The setName method is added to the object myself through $.extend. But here we mainly discuss how $.extend builds the jQuery library. I didn’t know that jQuery.extend and jQuery.fn.extend in the above code are the same function. We browsed the jQuery library and found that some methods are extended by calling jQuery.extend, and some are extended by calling jQuery.fn.extend.
Discussed separately below:
1. Extension through jQuery.extend
We know that the jQuery type in jQuery.extend is function, that is, the typeof jQuery value is the string "function". If jQuery is regarded as a class, jQuery.extend is equivalent to adding the static method extend to the class. Static methods do not require a new instance to be called. They are called directly through "class name + method name". That is, jQuery.extend(...), jQuery is assigned to $. Therefore we are more accustomed to $.extend(...).
The jQuery.extend method is called directly in the source code and only passes one parameter. As follows

Copy the code The code is as follows:

jQuery.extend({
noConflict: function ( deep ) {
window.$ = _$;
if ( deep )
window.jQuery = _jQuery;
return jQuery;
},
...
});

We know that if only one parameter is passed in extend, then this sentence will be executed

Copy code The code is as follows:

if ( length === i ) {
target = this;
--i;
}

That is, extend yourself, and this here is function jQuery. That is to say, many static methods have been added to function jQuery. These methods can be called directly through jQuery.xx (or $.xx) instead of executing (calling) the jQuery method first and then calling xx, such as $("# id").xx. Maybe the following example is easier to understand

Copy the code The code is as follows:

function fun(){ }//Define a class (function)
//Add a static method extend
fun.extend=function(obj){
for(var a in obj)
this[a] = obj[a];//Note: tihs here is fun
}
//Calling extend adds a static attribute name to the class, and the static method method1
fun.extend({ name:"fun",method1:function(){}});
//Output name, prototype, extend, method1
console.dir(fun)

Therefore, jQuery isFunction, isArray, isWindow, etc. are all static methods and can only be referenced through $.isFunction, $.isArray, $.Window. It cannot be referenced through $("...").isFuction, $("...").isArray, $("...").isWindow.
2, extend through jQuery.fn.extend
jQuery.fn is equal to jQuery.prototype, which means that an extend method is attached to the prototype of function jQuery. When extending by calling jQuery.fn.extend(object) (note that only one parameter object is passed), the extend function will still execute

Copy code The code is as follows:

if ( length === i ) {
target = this;
--i;
}

At this time, this is jQuery.prototype (the first one mentioned is the jQuery function itself). That is, many attributes and methods are added to jQuery.prototype. When a jQuery function is executed, such as $() or jQuery(), more often $(). This function will create a new jQuery (see the previous article about the composition of jQuery objects). At this time, the extended attributes and methods are attached to the object generated by new. Maybe the following example is easier to understand

Copy the code The code is as follows:

function fun(){}//Define a class (function)
//Add a method extended to the prototype of the class
fun.prototype.extend = function(obj){
for(var a in obj)
this[a] = obj[a];//Note: this here is fun.prototype
}
//Call the extend method on fun.prototype Add attributes, method
fun.prototype.extend({name:"fun2",method1:function(){}})
//Output name,extend,method1
console.dir(new fun( ))

So the extended properties or methods are added to the jQuery object. For example, bind, one, unbind, etc. can be called through $("...").bind, $("...").one, $("...").unbind. But it cannot be called through $.bind, $.one, $.unbind.
jQuery, like Prototype, extends the entire library through the extend method. Relatively speaking, jQuery's extension method is more difficult to understand.
The summary is as follows:
1. jQuery.extend({...}) is to add static properties or methods to function jQuery.
2. jQuery().extend({...}) is to add properties or methods to the jQuery object.
/js/2011/zchain/zchain-0.2.js