jQuery source code analysis-01 overall architecture analysis_jquery

1. Overall architecture

1.1 self-invoking anonymous function
Open the jQuery source code, first you will see this code structure:

Copy code The code is as follows:

(function( window, undefined) {
// jquery code
})(window);

1. This is a self-calling anonymous function. What stuff? In the first bracket, create an anonymous function; in the second bracket, execute it immediately
2. Why create such a "self-calling anonymous function"?
By defining an anonymous function, a "private" namespace is created. The variables and methods of this namespace will not destroy the global namespace. This is very useful and a feature that a JS framework must support. jQuery is used in thousands of JavaScript programs. It must be ensured that the variables created by jQuery cannot conflict with the variables used by the program that imports it.
3. Anonymous functions are called function literals grammatically. JavaScript syntax requires brackets surrounding anonymous functions. In fact, there are two ways to write self-calling anonymous functions (note the right bracket marked in red):

Copy code The code is as follows:

(function() {
console.info( this );
console.info( arguments );
}( window ) );
(function() {
console.info( this );
console.info( arguments );
})( window );

4. Why should we pass in window?
By passing in the window variable, the window is changed from a global variable to a local variable. When accessing the window in the jQuery code block, there is no need to roll back the scope chain to the top-level scope, so that the window can be accessed faster; This is not the key. More importantly, passing window as a parameter can be optimized when compressing the code. Take a look at jquery-1.6.1.min.js:
(function(a,b){} )(window); // window is optimized to a

5. Why add undefined to the parameter list?
In the scope of the self-calling anonymous function, ensure that undefined is truly undefined. Because undefined can be overwritten and given a new value.
undefined = "now it's defined";
alert( undefined );

Browser test results:
Browser
Test results
Conclusion
ie
now it's defined
can be changed
firefox
undefined
cannot be changed
chrome
now it's defined
can be changed
opera
now it's defined
Can be changed

6. Did you notice the semicolon at the end of the source code?
The semicolon is optional, but omitting it is not a good programming habit; for better compatibility and robustness, please add a semicolon after each line of code and make it a habit.
1.2 Overall Architecture
Let’s take a look at what functions are implemented in the self-calling anonymous function, arranged in code order:

Copy code The code is as follows:

(function( window, undefined ) {
// Construct jQuery object
var jQuery = function( selector, context ) {
return new jQuery.fn.init( selector, context, rootjQuery );
}
// Utilities
// Asynchronous queue Deferred
// Browser test Support
// Data Cache Data
// Queue
// Attribute operation Attribute
// Event processing Event
// Selector Sizzle
// DOM traversal
// DOM operation
// CSS operation
// Asynchronous request Ajax
// Animation FX
// Coordinates and size
window.jQuery = window.$ = jQuery;
})(window);

From the comments above, jQuery’s source code structure is quite clear and organized, not as obscure and confusing as the code.
The following chapters will basically unfold in this order.

1.3 Preview of the next section

If you have looked at the jQuery source code, you will soon find that it is full of regular expressions, and many JavaScript developers are neglectful of the basic knowledge of regular expressions. In order to scan To clear this obstacle, the next chapter will first review the basic knowledge of JavaScript regular expressions, and then analyze the regular expressions in jQuery in detail.
Before officially starting to analyze the source code, is there any basic knowledge that needs to be prepared?
Of course. For example, if you are not familiar with the classes and objects in the JavaScript API, you should at least have a reference manual at hand.
Except for regular rules, other knowledge points will be explained throughout the analysis process, and no new chapters are planned.