V. jQuery source code parsing: jQuery. extend (), jQuery. fn. extend ()

Source: Internet
Author: User

People who have extended jQuery or created jQuery plug-ins may be familiar with these two methods.
JQuery. extend ([deep], target, object1, object2... [objectN])
JQuery. fn. extend ([deep], target, object1, object2... [objectN])
Both attributes are used to merge the attributes of two or more objects to the target object.
Deep is a Boolean value, indicating whether to perform deep merge. The default value is false. deep merge is not executed.
In this way, you can add new attributes and methods on jQuery or jQuery. fn. Most of the other modules of jQuery are implemented in this way.

$. Extend () is used to add extensions to jQuery ()
For example: jQuery. extend ({add: function (a, B) {return a + B }})

Use: $. add (1, 3) ===> 4;

$. Fn. extend ();

$. Fn. extend ({gys: function({{}(this}.css ("color", "red ")}});

Call: $ ("div. guo"). gys ();

Because the number of parameters is uncertain, the acceptable parameters are not listed.

Options: point to a source object.
Name: A property name of a source object.
Src: the original value of a property of the target object.
Copy: the value of an attribute of a source object.
CopyIsArray: Indicates whether copy is an array.
Clone: the modified value of the original value during deep replication.
Target: the target object.
I: Start subscript of the source object.
Length: the number of parameters used to modify the variable target.
Deep: whether to perform deep replication.

333 ~ 338: if the first parameter is a Boolean value, the target is assigned to deep. The target is re-obtaining the value and the second parameter is assigned to target.
At this time, the I value is changed from 1 to 2. It indicates that the source object originally started from the second element and now becomes the third element.
The first line of code knows why this if statement exists. The original function extend assigned a value to target and I no matter what the parameter is.
And then modify it later.

341 ~ 343: if the target object target is not an object, not a function, targeted = {};

346 ~ 349: when the length and I are equal, it indicates that no parameters such as objcet1,... are passed in,
In this case, the current object (jQuery or jQuery. fn) of this is used as the target object, and I is reduced by one so that the input object is treated as the source object.

The first line starts a loop. I indicates the subscript of the starting source object, which is a very clever usage.
Row 3 is also wonderful. It puts the source object to be retrieved and the judgment on the source object in a statement and runs only when the source object is not empty.
354 ~ Row 3: The src variable is the original value, and the copy variable is the copy value. If the target and copy references the same,
Therefore, the attribute with the same name of the target object is not overwritten. If 360 rows are commented out, the following code will be abnormal.
Var obj = {};
Obj. n1 = obj;
$. Extend (true, obj, {n2: obj });
Different errors may be reported in different browsers, but all of them appear on the screen for a long time.

365 ~ Rows 372. If the copy operation is a common javascript Object or array, recursive merge is performed.
378 ~ Row 3: if it is not a deep merge and copy is not undefined, it overwrites the attribute of the same name of the target object.

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.