Explanation of $.extend

2 $.extend()
Because I saw this method useful in some places in the project, I didn't know what it meant at the time. I wanted

to about it. It turns out that this method is quite useful and is mostly used in writing plugins. Of course, it also has some overloaded prototypes.

2.1 extend(result, item1, item2.....)
Here this method is mainly used to merge, merge all parameter items into result, and return result, but

this will destroy the structure of result.

2.2 extend({}, item1, item2,...)
With this method, all the obtained results can be combined in {} and returned without destroying the original item structure.

Example:

Var item={name:”olive”,age:23};

Var item1={name:”Momo”,sex:”gril”};

Var result=$.extend({},item,item1);

result :

Result={name:”Momo”,age:23,sex:”gril”};

Description:

The above results show that the extend method merges all items into {}, but, if you are careful, you will find that item1 The name: "Momo" in the item overwrites the name: "olive" in the item. What's going on? Please read on.

2.3 extend(bool,{},item1,item2….)
The Extend method also has overloads with bool parameters.

The bool parameter is true for a deep copy, and false for a shallow copy. It can be explained by the following example:

Example:

var item={name: "olive",age:23,address{provice:"Henan",city:"Zhengzhou"}};

var item1={sex:"girl", address{city:"Beijing"}};

var result=$.extend(true,item,item1);

var result1=$.extend(false,item,item1);

result:

Result={name:"olive",age :23,sex:"gril",address:{provice:"Henan",city:"Beijing"}};

Result1={name:"olive",age:23,sex:"gril",address:{ city: "Beijing"}};

Description:

The above results show that when the parameter is true, it is a deep copy. When the sub-item in item1 has a different value of the same attribute as the sub-item in item, the sub-item in item1 The value of the item will overwrite the value in the item sub-item. When the attribute of the sub-item item1 is different from the attribute in the item, it will be merged with the item.

When the parameter is false, when the child item in item1 has the same attribute as the child item in item, the attribute value of the child item in item1 will completely overwrite the value in item.

2.4 $.extend(item)
This method is to merge the item into the Jquery global object, which is equivalent to adding a Jquery global object

Static methods (corresponding to the static methods here, and of course instance methods, which will be introduced later).

     Example:

           $.extend({SayHello:function(value){alert("hello "+value);}});

           After writing this, you can directly call the SayHello method:

           $.SayHello("Olive");

     Description: This method is equivalent to adding a new method to the Jquery class.

2.5 $.fn.extend(item)
The $.extend(item) mentioned above is to add a static method to the Jquery class, then the $.fn.extend(item

) here is to add an instance method to each instance .

     Example:

         $.fn.extend({hello:function(value){alert("hello "+value);}});

         After writing this, after getting each example, you can call this method:

         $(" #id").hello("Olive");