Objective
The previous article already has some knowledge about jquery, including the jquery selector and Dom object, and this article continues to look at jquery's useful work with arrays.
The operation of an array in jquery is roughly in the following ways:
Each (iteration), map (transform), grep (filter), merge, etc.
1, iteration (each)
Jquery.each (object, callback) return value: Object
Description
A general-purpose example of a method that can be used to sample objects and arrays.
Note: The first parameter passed in can be an array or an object. If an array, iterate through each object in the array. The first parameter represents an index, and the second parameter represents the value. This represents the currently traversed element, which can be terminated by returning false
Example Demo:
<body>Run the result diagram:
Special Note: each iteration of each element or attribute does not change the value of the current element in the iteration function, that is, the returned object cannot be changed.
If you need to change each element in the array and return the result, use the Jquery.map (array, callback) function.2, conversion (map)
Jquery.map (Array, callback)
return value: ArrayDescription
Converts an element in an array to another array.
The conversion function can return a converted value, null (delete an item in an array), or an array containing a value, and extend to the original array.
The first parameter represents a value, and the second parameter represents the index .<body> }); $ ("#P2"). Text (str); $ ("#P3"). Text (Members.join (","));});Run the result diagram:
3, Filtering (grep)
Jquery.grep (Array, callback, [invert]) return value: Array
The Array:array type will be filtered by the array.
The filter function specified by the Callback:function type.
Invert: Optional/boolean type default value is False. Specifies whether to invert the filter results.Description
The function iterates through the array elements and executes the filter function functions. It provides two parameters for function: One is the array element of the current iteration, and the other is the index of the current iteration element in the array.
If the invert parameter is not specified, or if the argument is false, the resulting array will contain all elements that function returns TRUE. If the parameter invert is true, the resulting array will contain all elements that function returns FALSE.
The source array is not affected, and the filtered results are reflected only in the returned result array.<body>4, merging
(1) Jquery.extend ([deep], Target, Object1, [objectn])
[Deep]: Optional/boolean type Indicates whether the object is deeply merged, false by default. If the value is true, and if a property with the same name for multiple objects is also an object, the properties of the Property object are also merged.
The Target:object type target object, and the member properties of other objects are copied to the object.
Object1: Optional/object Type the first object to be merged.
[OBJECTN]: Optional/object Type the nth merged object.
The function can copy the member properties and methods of one or more objects onto the specified object.
Examples are as follows:Appends a newline label and the specified HTML content to the current page function W (HTML) { Document.body.innerHTML + = "<br/>" + html;} var x = {name: "Codeman"};var y = {age:18};var z = {site: "http://www.cnblogs.com/wang-meng/" };var obj = $.exten D (x, y, z); W (obj = = = x); TRUEW (Obj.name); CODEMANW (Obj.age); 18w (Obj.site); http://www.cnblogs.com/wang-meng/
(2) Jquery.makearray (obj)
The function is used to convert a class array object to a true array object.
Class array objects are very common: for example, jquery objects that we use frequently, arguments objects within functions, are class array objects.
Jquery.makearray () Function: We can convert a class array object to a real array object, thus using the built-in method of the Array object.
Examples are as follows:<p> paragraph 1</p><p> paragraph 2</p>//appends the wrapping label and the specified HTML content to the current page function W (HTML) { Document.body.innerHTML + = "<br/>" + html;} The jquery object is also a class array object var $p = $ ("P"), var arr1 = $.makearray ($p); W ($p instanceof Array); Falsew (arr1 instanceof Array); The true//NodeList object is also a class array object var p = document.getelementsbytagname ("P"); var arr2 = $.makearray (P); W (P instanceof Array ); Falsew (arr2 instanceof Array); Truefunction Foo (A, b) { //arguments object is also a class array object //arguments is a copy of the received argument, var arr3 = $.makearray (arguments) ; W (arguments instanceof Array); False W (arr3 instanceof Array);//True}foo (1, 2);(3) Jquery.inarray (value, array)
Value: Any type used to find the values.
The Array:array type specifies the array to be looked up.
function is used to search the array for the specified value and return its index value. If the value does not exist in the array, 1 is returned.
Examples are as follows:Appends a newline label and the specified HTML content to the current page function W (HTML) { Document.body.innerHTML + = "<br/>" + html;} var arr = [Ten, 3, 0,-3];w ($.inarray (arr.)); 1w ($.inarray ( -3, arr)); 4w ($.inarray (arr.)); There is no 99w in the 0//Array ($.inarray (), arr); The -1//array has the number 10, but there is no string "ten" W ($.inarray ("Ten", arr)); -1
(4) Jquery.merge (first, second)
Merging two arrays
The returned result modifies the contents of the first array-the elements of the first array followed by the elements of the second array.
To remove duplicates, you need to use $.unique ()Merges two arrays onto the first array: $.merge ([0,1,2], [2,3,4]) Result: [0,1,2,2,3,4](5) Jquery.unique (array)
Deletes the repeating element in the array. Handles only the deletion of an array of DOM elements, not a string or a numeric array.$.unique ([0,1,2], [2,3,4]) results: [0,1,2,3,4](6) Arguments (add content)
JavaScript does not have the function of overloading functions, but the arguments object is capable of simulating overloads. Each function in Javascrip has a arguments object instance arguments, which refers to the arguments of the function and can refer to the arguments element in the form of an array subscript "[]".
Arguments.length is the number of function arguments, and Arguments.callee refers to the function itself.
Examples are as follows:function test () { ///Loop output The parameter passed in when calling the current function for (var n = 0; n < arguments.length; n++) { document.write (arguments [n] + "|"); } document.write (' <br> '); Output line breaks differentiate};test (); (empty string) test ("Code", "http://www.cnblogs.com/wang-meng/", N, True); Code|http://www.cnblogs.com/wang-meng/|12|true|test ("Zhang San", false, 12.315); Zhang San |false|12.315|function foo () { ///Arguments can also be preceded by the function name for (var n = 0; n < foo.arguments.length; n++) { document.write (Foo.arguments[n] + "|"); } document.write (' <br> ');}; Foo ("Hello", "World"); hello| world|//uses the arguments object to implement any number of SUM function sum () { var sum = arguments[0]; for (var n = 1; n < arguments.length; n++) { sum + = Arguments[n]; } return sum;} Document.writeln (sum ()); Undefineddocument.writeln (SUM (1, 5)); 6document.writeln (sum (1, 212, 21,-14, 23)); 2435, other
More operations on arrays see: W3school JS Array
Http://www.w3school.com.cn/jsref/jsref_obj_array.aspThe above content is in their own study of the content, if there are flaws please see can remind you. Sorting records here is a summary of their own learning, to the future forget their own a reference.
English tips:
Good for you.
All right! Well done!
Great minds think alike!
Great think alike
There is a nice day.
I wish you a happy day.
Has butterflies in one s stomach.
Nervous.
He ' s been everywhere.
He has been to all over the place.
He hits the ceiling at the news.
He flew into a rage when he heard the news.
He argument doesn ' t hold water.
His argument is untenable.
How does I address you?
What do I call you?[jquery Learning Series two]2-jquery learning two-array manipulation
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
