Progressive analysis of jquery source line

Source: Internet
Author: User

Note: This source analysis selects 2.0.3 (because does not support IE6, 7, 8, there is a lot less compatible with the hack of the writing, to understand the principle of the implementation of jquery has a great help)

1.jQuery is available in different versions, IE6, 7, 8 are no longer supported from the 2.x version

Learn about the jquery split long frame 1.1 point

2.

(function ()) ();

This is called anonymous function self-executing

3. What are the benefits of anonymous function self-execution?

anonymous functions self-executing everything inside is a local. Prevent conflicts with other code.

Chestnut ①

(function () {
var a=10;
})();
alert (a);

Console error, said a is not defined.

4. How can I access the methods of anonymous function self-executing?

Many ways (⊙o⊙) Oh. You can use the interface you want to provide as a property of window or a method.

Chestnut ②

(function  () {    var a=10;         function ABC () {        alert (a);    }    The ABC method can be used as the window method to access the anonymous function from outside the    window.abc=ABC;}) (); ABC ();

But to provide interfaces externally, we can find the methods and properties used

5. In jquery, $ () is a shorthand for jquery ().

6. Lines 21st through 94th in the jquery file define variables and functions.

Of these, 60-64 rows is a particularly important function, that is, the usual $ () jQuery () external interface

// Define A local copy of JQuery function (Selector, context) {    // The JQuery object is actually just the Init constructor ' enhanced '     returnnew  jQuery.fn.init (selector, context, rootjquery);},

But now this jquery is still in the form of local variables, to provide external interfaces , can be used. Provide interface on 第8823-8827 line

// If There is a Window object, so at least have a document property, // define JQuery and $ identifiers if typeof typeof Window.document = = = "Object" ) {    = window.$ = jQuery;}

7. On the 第96-283 line, add some methods and properties to the jquery object.

Prototype is an object-oriented thing, so jquery is an object-oriented program, and jquery is written about object-oriented.

96 Rows
Jquery.fn = Jquery.prototype

8. Why is jquery an object-oriented program??

Chestnut ③

That's how jquery calls methods, right. is not the same way as the following array uses the method.
But actually $ ("div") is a function call, but the result of a function call is an object, so that's why jquery is based on object-oriented programming.
$ ("div"). CSS (); $ ("div"). Text ();
This is how the array object method is used, instantiating an object first, and then invoking the method using the object. var arr=New Array (3); Arr.sort (); Arr.splice ();
61--64
function (Selector, context) { //After this function is executed is a new constructor, the return is a jquery object ~ ~ Since the return is an object, of course, you can call the method ~ ~ Returnnew jQuery.fn.init (selector, context, rootjquery);}

9.285--347--Extend: It's a way to inherit from jquery, and hopefully the subsequent additions will hang on the jquery object for easy extension

10.

// The method that is called by using an object is an instance method.  $ (). text (); $ (). HTML (); // $ is a function that expands methods under a function to extend some static methods // in jquery, object-oriented extended static properties and static methods are called extension tool methods
The difference between a tool method and an instance method is that it can be used either for jquery objects or for source JS, and the instance method can only call the jquery object.
$.trim (); $.proxy ();

11. How do static and instance methods relate to jquery?

Static methods can be thought of as being at the very bottom of jquery, while instance methods are on the upper level or higher.

Many methods are instance methods, all of which are called tool methods.

Implementation of complex selector with--2856 line of 12.877 rows Sizzle

13.2880 rows--3042 Callbacks Callback object: Unified management of functions

Progressive analysis of jquery source line

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.