Daily Learning Experience: $.extend () method and (function ($) {...}) (JQuery) detailed

1. The difference between substring and substr in JS

Prior to using the substring method in the project, because C # also has the method of intercepting the string substring methods, then did not think much of the two methods are mistaken for the same. In this way, directly according to the use of substring in C #, directly in the JS with the substring, in the actual project, sometimes get the right results, but sometimes the results are incredible, and then carefully after the debugging tracking only found that It turns out that the substring method in JS is different from the substring method in C #. The method of string interception in C # has been very simple and is not described here. Mainly talk about a JS in the substring method, by the way substr method.

Substring:

The method can have either a parameter or two parameters.

L One parameter:

Example: Var str= "Olive";

Str.substring (3);

Result: "VE"

Description: When substring has only one parameter, the parameter representation is intercepted from the beginning of the string,

Truncate to the end of the string.

L Two parameters:

Example: Var str= "Olive";

1) str.substring (3,4);

2) str.substring (3,2);

Results: 1) "V" 2) 0

Note: When substring has two parameters, the first parameter represents the intercept from the beginning of the string, and the second parameter indicates the number of the string to intercept. This is a C # character intercept a different point, so it will lead to different results.

SUBSTR:

The method can also have one or two parameters.

L One parameter:

Description: When substr a parameter, the function is the same as when the substring method is a parameter.

L Two parameters:

Example: Var str= "Olive";

1) str.substr (3,2);

2) str.substr (3,4);

Results: 1) "VE" 2) "VE"

Description: When the substr has two parameters, the first parameter represents the intercept from the beginning of the string, and the second parameter indicates how many bits of string are intercepted. This is the same as the character interception in C #, so it is best to use substr in future use if you want to avoid the interception problem.

2 $.extend ()

Because there are some places in the project to see useful to this method, then do not know what the meaning, see more and think

Solve it. This method is still very useful, used in writing plug-ins, of course, it itself has some overloaded prototypes.

2.1 Extend (result,item1,item2 ...)

This method is used primarily for merging, merging all parameter items into result, and returning result, but this

Will destroy the structure of result.

2.2 Extend ({},item1,item2,......)

With this method, you can combine the resulting results in {} and return them without destroying the structure of the original item.

Example:

Var item={name: "Olive", age:23};

Var item1={name: "Momo", Sex: "Gril"};

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

Results:

Result={name: "Momo", Age:23,sex: "Gril"};

Description

The results above show that the Extend method merges all the items into the {}, but it is a little more careful to find that the name in Item1: "Momo" overwrites the name: "Olive" in item, what's going on? Please look down.

2.3 Extend (bool,{},item1,item2 ...)

The Extend method also has overloads with the bool type parameter.

A bool parameter of TRUE indicates a deep copy, and a shallow copy when False. You can use this example to illustrate:

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);

Results:

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 ture, which is a deep copy, when the subkey in subkey Item1 has the same value as the subkey in item, the value of the ITEM1 sub-item overrides the value in the Item subkey, and when the child item Item1 property is not the same as the property in item. will be merged with item.

When the argument is false, the subkey in the subkey Item1 is in the same time as the subkey property in item, and the value of the ITEM1 item is completely overwritten by the value in item.

2.4 $.extend (item)

The method is to merge the item into the jquery global object, which is equivalent to adding a

static method (corresponding to the static method here, of course, there is an example method, in the back of the introduction).

Example:

$.extend ({sayhello:function (value) {alert ("Hello" +value);});

Once this has been written, you can call the SayHello method directly:

$. SayHello ("Olive");

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

2.5 $.fn.extend (item)

The $.extend mentioned above adds a static method to the JQuery class, so here's the $.fn.extend (item

) is to add an instance method for each instance.

Example:

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

After you have written this, you can call the method after you have obtained each example:

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

3. (function ($) {...}) (JQuery)

When I first saw this kind of writing, confused, unintelligible. After finding some information on the Internet, I got a little understanding.

Let's first look at the contents of the first parenthesis: function ($) {...}, is this an anonymous function? But its formal parameter is more strange, is $, here is mainly to do not conflict with other libraries.

This makes it easier to understand that the first parenthesis is defined as an anonymous function, and we call the function with parentheses and arguments behind the function name, but because the operator's precedence we define the anonymous function to be enclosed.

Now I think we have a good idea of what this sentence means. The first parenthesis indicates that an anonymous function is defined, and then the second function represents the argument passed by the function, and the entire combination means that an anonymous function is defined and then called, and the function's argument is jquery.

Equivalent: function Fun ($) {...}; Fun (jQuery);

This method is mostly used for the development of plug-ins, when executing the code, the DOM object does not necessarily load complete. The opposite is $ (function () {}), which is used when the DOM object of the page is loaded. In fact, the full write of this method is: $ (document). Ready (function () {});

Well, today summed up here, is mainly related to write plug-ins commonly used methods, I hope to give you some help.

Copyright NOTICE: This article for Bo Master original article, without Bo Master permission not reproduced.

Daily Learning Experience: $.extend () method and (function ($) {...}) (JQuery) detailed