This article summarizes some of the initialization work that JS did when it was introduced.
The first sentence window.undefined=window.undefined;
is written for compatibility with the lower version of IE
Because undefined is not a property under the Window object in the low version of IE
So window.undefined is undefined.
According to the characteristics of the right tuberculous character of the = operator, the window.undefined on the right is undefined
Since window has no undefined property
So the left side can actually be understood as extending a undefined property under window
This value is undefined.
Next
if ( $ ){ = $;}
This is for conflict prevention.
If you introduce a different library before you introduce jquery
And the other libraries already have $ as global variables
This will first place the $ existing in the other library under the _$ property
Next, we'll assign jquery to $
When you call $ again after that, it's jquery's $.
If you want to use a different library
You can get it through jquery._$.
Next, assign the already defined jquery constructor to the $
var $ = jQuery;
And then added some example methods to jquery.
I personally feel that these instance methods are at a top-level position
This means that many other methods are called in these methods, especially when other static methods are called
So I want to learn some of the most basic static methods and then look back at this part
Next up is the Extend method.
Extend is a basic method of jquery internal extension instantiation and static methods
is also a way for jquery to expand the external plugin
function (obj,prop) { ifthis;} for var in prop) obj[i] = prop[i]; return obj;};
V1.0.0 's extend logic is simple.
From the definition of a function, the author wants to pass two parameters to extend: obj and prop
The function naturally is to extend the members of the prop to obj.
But if only one parameter is passed in, it represents the extension to jquery or Jquery.fn itself.
Which means that obj is jquery or Jquery.fn.
The first sentence in the method is the function.
It is worth mentioning that this place skillfully exploits this
If you call by using the following method
Jquery.extend ({"AAA": 1})
So the this point inside is jquery, which expands the AAA into a static member of jquery.
And if you call it by this way
JQuery.fn.extend ({"BBB": 2});
So the inside of this is pointing to Jquery.fn, the Jquery.prototype, which expands the BBB into an instantiated member of jquery.
And then we expand some static members.
These static properties or methods cover initialization, property manipulation, style manipulation, dom manipulation, selectors, event systems, and more
Initialize: Init
Property operation: Classname.add classname.remove Classname.has attr
Style action: Swap CSS Curcss
Dom Operation: Clean getAll parents Sibling
Selector: Expr token find parse filter
Event System: Event.add event.remove Event.trigger event.handle event.fix
Tool Method: Each trim merge grep map
These methods, and so on, have come to a concrete look.
And then there's an initialization code block, which adds two static members to jquery:
Jquery.browser and Jquery.boxmodel
Jquery.browser is used to judge the browser, Jquery.boxmodel is used to determine whether it is a standard box model
Both of these properties are simple
And then there's this static member of Jquery.macros.
Macros in fact, there are several methods of "public information" stored
These methods are implemented in the next Jquery.init ()
jquery.extend ({jquery.initdone=true; Init:function() {Jquery.each (JQuery.macros.axis,function(i,n) {...}); Jquery.each (JQuery.macros.to,function(i,n) {...}); Jquery.each (JQuery.macros.each,function(i,n) {...}); Jquery.each (JQuery.macros.filter,function(i,n) {...}); Jquery.each (JQuery.macros.attr,function(i,n) {...}); Jquery.each (JQuery.macros.css,function(i,n) {...}); }, each:function(Obj,fn,args) {if(Obj.length = =undefined) { for(varIinchobj) {fn.apply (obj[i], args||[I, Obj[i]]); } }Else{ for(vari = 0; i < obj.length; i++) {fn.apply (obj[i], args||[I, Obj[i]]); }}returnobj; }});
Jquery.macros ={to: {appendTo:"Append", Prependto:"Prepend", InsertBefore:"Before", InsertAfter:"After"}, CSS:"Width,height,top,left,position,float,overflow,color,background". Split (","), filter: ["EQ", "LT", "GT", "contains"], attr: {val:"Value", HTML:"InnerHTML", ID:NULL, Title:NULL, Name:NULL, href:NULL, SRC:NULL, rel:NULL}, Axis: {parent:"A.parentnode", Ancestors:jQuery.parents, Parents:jQuery.parents, Next:"Jquery.sibling (a). Next", prev:"Jquery.sibling (a). Prev", siblings:jQuery.sibling, children:"A.childnodes"}, each: {removeattr:function(key) { This. removeattribute (key); }, Show:function(){ This. style.display = This. oldblock? This. Oldblock: ""; if(Jquery.css ( This, "display") = = "None" ) This. style.display = "Block"; }, Hide:function(){ This. Oldblock = This. oldblock | | JQUERY.CSS ( This, "Display"); if( This. Oldblock = = "None" ) This. Oldblock = "Block"; This. style.display = "None"; }, Toggle:function(){ $( This)[ $( This). Is (": hidden")? "Show": "Hide"].apply ($ ( This), arguments); }, AddClass:function(c) {JQuery.className.add ( This, c); }, Removeclass:function(c) {JQuery.className.remove ( This, c); }, Toggleclass:function(c) {jquery.classname[JQuery.className.has ( This, c)? "Remove": "Add"] ( This, c); }, remove:function(a) {if(!a | | jquery.filter ([ This], a). R) This. Parentnode.removechild ( This ); }, Empty:function(){ while( This. FirstChild) This. RemoveChild ( This. FirstChild); }, bind:function(Type, fn) {if(Fn.constructor = =String) FN=NewFunction ("E", (!fn.indexof (".")? "$ (This)": "Return") +FN); JQuery.event.add ( This, type, FN); }, Unbind:function(Type, fn) {JQuery.event.remove ( This, type, FN); }, Trigger:function(type, data) {JQuery.event.trigger (type, data, This ); } }};
Jquery.init ();
The Init method was called during jquery initialization
The Init method iterates through each of the enumeration methods in the macros.
Each method internally determines whether the incoming obj is an array or an object to determine whether it is a foreach traversal or A For loop
Finally, these methods will be implemented and extended to Jquery.prototype.
Further down, the prototype method is expanded toggle hover ready and static method
And then there's a new function () {} Self-executing code block
The first half of this code block is to extend some event methods and their event extension methods for instantiating objects
The so-called event extension method, for example, the Click event
Corresponding, there are unclick oneclick these two extension methods
The second part is the function of load.
The code finally expands on some members of the animation and Ajax
In general, the jquery source code contains the following modules:
1. Basic Tools and methods
2. Event System
3. domready--wait for the DOM structure to load and then execute the corresponding function
4. Dom operation
5. Attribute and style operation
6. Selector
7. Animation
8. Ajax
jquery Source Learning 2--initialization of the article