Detailed explanation of usage examples of jQuery.extend function

JQuery's extend extension method:
Jquery's extension method extend is a commonly used method when we write plug-ins. This method has some overloads Prototype, here, let’s learn about it together.
     1. Jquery’s extension method prototype is: 　

##extend(dest,src1,src2,src3.. .);

It means merging src1, src2, src3... into dest, and the return value is the merged dest. It can be seen that this method is modified after merging. The structure of dest. If you want to get the merged result but don’t want to modify the structure of dest, you can use it as follows:

var newSrc=$.extend({},src1,src2,src3. ..)//That is, use "{}" as the dest parameter.

This way you can merge src1, src2, src3... and then return the merged result to newSrc. For example:

var result=$.extend({},{name:"Tom",age:21},{name:"Jerry",sex:" Boy"})

Then the merged result

result={name:"Jerry",age:21,sex :"Boy"}

That is to say, if the later parameter has the same name as the previous parameter, then the later parameter will overwrite the previous parameter value.

# omitting Dest parameter The DEST parameter in the above Extend method prototype can be omitted. If it is omitted, there is only one SRC in this method. Parameters, and merge the src into the
object that calls the extend method, such as: 　
1, $.extend(src)
This method is to merge src Merge into the global object of jquery, such as:

$.extend({

hello:function(){alert('hello'); }
});

It is to merge the hello method into the global object of jquery.
　
2.$.fn.extend(src) This method merges src into the jquery instance object, such as:

$.fn.extend({

hello:function(){alert('hello');}
});

　 is to merge the hello method into In the jquery instance object.

The following are some commonly used extension examples:

$.extend({net:{}});

This is to extend a net

namespace in the jquery global object.

$.extend($.net,{

hello:function(){alert('hello');}
})

This is to extend the hello method into the previously expanded Jquery net namespace.

　

3. Jquery’s extend method also has an overloaded prototype:

extend(boolean,dest,src1,src2, src3...)

The first parameter boolean represents whether to perform a deep copy. The other parameters are consistent with those introduced before. What is a deep copy? Let’s look at an example:

var result=$.extend( true, {},

{ name: "John", location: {city: "Boston",
county:"USA "} }, { last: "Resig", location: {state: "MA",county:"China"} } );

We can see that there are nested substrings in src1 The object location: {city: "Boston"}, the sub-object location: {state: "MA"} is also nested in src2, the first deep copy parameter is true, then the merged result is:

result={name:"John",last:"Resig",

location:{city:"Boston",state:"MA",county:"China"}}

That is to say, it will also merge the nested sub-objects in src. If the first parameter boolean is false, let’s see what the result of the merger is, as follows:

var result=$.extend( false, {},

{ name: "John", location:{city: "Boston",county:"USA" } },
{ last: "Resig", location: {state: "MA",county:"China"} }
                );

Then the merged result is:

result={name:"John",last:"Resig",location:{state:"MA ",county:"China"}}

The above are some details that $.extend() is often used in projects.

The above is the detailed content of Detailed explanation of usage examples of jQuery.extend function. For more information, please follow other related articles on the PHP Chinese website!