jQuery prototype diagram, let you quickly on the jQuery have a grasp of the whole

sponsored links
Several months ago, the garden in the blog to see an article , the content is simply a graph showing the jQuery object in the relationship between the time to think, this is what I want most intuitive summary jQuery way. In that article, many people expressed surprise that not understand. Here I drew a heavy and elaborate. Annex provides a visio file formats.

jQuery prototype diagram, let you quickly on the jQuery have a grasp of the whole


The following will combine the jQuery source, on the diagram to explain the various parts one by one. In the figure, circle numbers represent the jQuery source location, the circle shows the location of the same number of these places from the same block (block) code.
/**
 *   ① What is   jQuery?
 *
 * window   Is the object, which has two properties  ,  Respectively, and jQuery   $,  The value is a function, this function name is   jQuery.  In the function  
 *   The definition of entity, in fact, by   jQuery.fn.init   Function to construct the object, init function is the real constructor  .  That is  ,
 *   We   ${ ... )   Get the instance actually jQuery.fn.init  .
 */
var jQuery = window.jQuery = window.$ = function( selector, context ) {
        // The jQuery object is actually just the init constructor 'enhanced'
        return new jQuery.fn.init( selector, context );
};

/**
 *   ② the so-called   jQuery   Physique   
 *
 * jQuery   Function has two properties, namely   fn   And the prototype, its value is an anonymous object  (json   Object ).
 */
jQuery.fn = jQuery.prototype = {
        init: function( selector, context ) {
                ...
        },
        
        jquery: "1.2.6",
        
        get: function( num ) {
                ...
        },
        
        ...
}

/**
 *   ③ given   jQuery   Power bar  
 *
 *   Do not look to this code word, a short  ,  Is not it? But this code is very important  .
 *
 *   First, init is a function  ,  Objects constructed by jQuery.fn.init  ,  Instances it is only jQuery.fn.init  ,
 * jQuery.fn   Also said before, it is a anonymous   json   Object containing   init   And so on function, we want   jQuery.fn.init   Construction  
 *  Out if the object has a lot of behavior, prototype is the best means of  .  Suppose we define a function, named   Car
 *   It, using   prototype   Way to add behavior we are familiar with it  :
 * function Car(owner) {
 *   this.owner = owner;
 * }
 * Car.prototype = {
 *   go: function() { ... }
 *   brake: function() { ... }
 * }
 *   Thus, by   new Car()   Constructed object to go and have the   brake   Behavior  .
 *
 *   Therefore, because the following sentence  ,  Init the object is constructed to have the   jQuery.fn   All acts defined, and very smart  !
 */
// Give the init function the jQuery prototype for later instantiation
jQuery.fn.init.prototype = jQuery.fn;

/**
 *   ④ please give me the freedom to expand  
 *
 *   Indeed, jQuery or   jQuery.fn   Defined function you may feel not enough  ,  It does not matter, John Resig has provided us with  
 *   Space for expansion. JQuery and   jQuery.fn   Has a name attribute to extend  ,  The type of the property is a   function,
 *   The function itself has provided us with the extensions  .
 *
 * extend   Property represented by the function, but   50   Lines of code, written in a very insightful  ,  Have the time, we can debug the next step  ,
 *   John Resig of magic knowledge under the  -
 */
jQuery.extend = jQuery.fn.extend = function() {
        ......
}

JQuery is the core of more than four codes, such as event handling code, you can find the shadow code from the above four. Enjoy jQuery ~
  • del.icio.us
  • StumbleUpon
  • Digg
  • TwitThis
  • Mixx
  • Technorati
  • Facebook
  • NewsVine
  • Reddit
  • Google
  • LinkedIn
  • YahooMyWeb

Related Posts of jQuery prototype diagram, let you quickly on the jQuery have a grasp of the whole

  • Javascript Object Model

    Javascript Object Model

  • Hibernate in the inverse and cascade

    First of all, to quote another blog saying: 1.cascade ="..."? cascade is not a property of many-to-many relationship must have it just so that we insert or delete at the time like some more convenient, as long as the source of the cascade insert

  • To a generic hibernate example DAO

    Reprint: http://blog.csdn.net/dingx package sgf4web.dao; import java.io.Serializable; import java.util.*; import java.util.regex.Matcher; import java.util.regex.Pattern; import org.hibernate.*; import org.hibernate.criterion.*; import org.springframework.

  • js events dynamically add and write-off

    IE's JScript existence of memory leak bug must we all know or have heard of. This is because of IE's memory recovery manager of a design error. When we create a prepared script when a cross-reference, for example, the following code: window.o ...

  • JS in the Date type conversion

    http://blog.csdn.net/yzy0612/archive/2007/08/07/1730732.aspx

  • JavaScript inheritance

    About JavaScript inherited a small example ... <! DOCTYPE HTML PUBLIC "- / / W3C / / DTD HTML 4.01 / / EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="Content-Type" conte ...

  • How the primary key agent-hibernate

    Existing Table A, B Statement: A, B field id-based keys. A: [id, name] B: [id, Aid, title] B and A's set up a many-to-one relationship because of A, B two tables are the primary key id field so add B when Hibernate will automatically retrieve id ...

  • spring + hibernate + oracle9i to read and write CLOB

    Database-driven update classes12-9i.jar Hibernate modify the configuration of the following code <bean/> <bean Lazy-init="true"> <property name="nativeJdbcExtractor"> <ref local="nativejdbcExtractor"/>

blog comments powered by Disqus
Recent
Recent Entries
Tag Cloud
Random Entries