Long time no write the content of the jquery source.
The development of jquery is a big factor because it is very easy to expand, and the reason is that it benefits from the Extend function
The function is an extension function ... is an extended function, which is actually a shallow copy and a deep copy function.
The function is really powerful, and it's very elegant to write.
Take a look at the usage first, there are three ways to use it.
The code is as follows |
Copy Code |
1, $.extend (DEST,SRC1,SRC2,SRC3 ...); 2, $.extend (SRC) 3, $.extend (BOOLEAN,DEST,SRC1,SRC2,SRC3 ...)
|
The meaning is to merge the SRC1,SRC2,SRC3 into the Dest object ...
In particular, the third, the significance of the first parameter is whether to SRC1,SRC2, such as deep copy.
So what is deep copy?
The code is as follows |
Copy Code |
var ret=$.extend (true,{}, {name: ' Siren ', About:{age:24,country: ' Beijing '}}, {from: ' Hebei ', birthday:{year:1988,month:02}} );
|
If the first value is true, then the SRC1,SRC2 is deeply copy.
This time the RET return value is
The code is as follows |
Copy Code |
Ret={name: "Siren", About:{age:24,country: "Beijing"},from: "Hebei", birthday:{year:1988,month:02}};
|
Found that even the properties of about and birthday together into the dest inside. This is deep copy.
So look at the source.
The code is as follows |
Copy Code |
O.extend = O.fn.extend = function () { var J = Arguments[0] | | {}, H = 1, I = Arguments.length, E = False, G if (typeof J = = "Boolean") { E = J; J = Arguments[1] | | {}; H = 2 } if (typeof J!== "Object" &&!o.isfunction (j)) { J = {} } if (I = = H) { J = this; --h } for (; H < I; h++) { if ((G = arguments[h])!= null) { for (Var F in G) { var K = j[f], L = G[f]; if (J = = L) { Continue } if (E && l && typeof L = = = = "Object" &&! L.nodetype) { J[F] = O.extend (E, K | | (L.length!= null?) []: {}), L } else { if (L!== g) { J[F] = L } } } } } Return J }; |
This is the definition part of the method.
We analyze it by line.
Line 2nd Gets the first argument that extend passes in ... If it is not initialized to an object.
4 lines gets the number of arguments.
Line 7: If the first argument passes over a bool type, this time the usage is the third one we mentioned earlier.
Line 12-14: is a rule that the first parameter is either bool or obj. Of course, the obj type also includes functions in JS.
Line 18-34: copy. Variable g is a temporary variable that holds the current SRC value.
such as executing $.extend ({},{a:10}); G is equal to {a:10}
Line 26-27: If you make a deep copy, the SRC attribute is also an object and is not an element object ... This time again calls O.extend recursively for replication.
Otherwise
Line 29-31: Where is l!==g g defined? Not defined so it equals undefined.
J[F] = L; F equals the property name ... L equals the value. J Equals our dest.
How did you get it? So we can also write a very good inheritance function of the cow oh ...
I'll start with a simple one.
The code is as follows |
Copy Code |
(function () { var s={}; S.extend=function () { var a=arguments[0]| | {}, E=false,//Whether it is a deep copy H=0,//number of parameters J=ARGUMENTS[1], N=arguments.length,g; if (typeof arguments[0]=== ' Boolean ') { E=arguments[0]; h=1; }; for (; h<n;h++) { G=ARGUMENTS[H]; if (typeof G!=null) { for (Var t in G) { if (e && g[t] && typeof g[t]== ' object ' &&!g[t].nodetype) {//Deep copy O.extend (E, (j| | {}), g[t]); }else{ if (g[t]!=undefined) { J[T]=G[T]; Copy } } } } } Return J; }; var c=s.extend ({a:10},{name: ' Siren ', T:{age:20,sex:1}}) Console.log (c) })() |
What do you think.. Is it very simple??