Common javascript Array Methods
(1) Basic Array Method
1. join ()
The Array. join () method converts all elements in the Array into strings and concatenates them to return the final string generated. You can specify the Separator by yourself. If not specified, commas are used by default.
1 2 3 4 5 6 |
Var arr = [1, 2, 3]; Console. log (arr. join (); // "1, 2, 3" Console. log (arr. join ("-"); // "1-2-3" Var a = new Array (10); // an empty Array with a length of 10 to form the following string Console. log (a. join ("-"));//"---------" |
2. reverse ()
The Array. reverse () method reverses the elements in the Array and returns the reverse Array (the returned Array is itself, and the original Array has changed)
1 2 3 |
Var arr = [1, 2, 3]; Arr. reverse (); Console. log (arr. join (); // "3, 2, 1" |
Therefore, if you want to reverse a string, you can
1 2 3 4 |
Var str = "abcdefg "; Console. log (str. split (""). reverse (). join (""); // "gfedcba" returns a new value. Console. log (str); // "abcdefg" of course, the original is not changed. |
3. sort ()
The Array. sort () method sorts the elements in the Array and returns the sorted Array.
When parameters are not included, they are sorted sequentially by default, that is, from small to large. Of course, you can also directly add a comparison function to sort.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 |
Var arr = [1, 4, 7]; Arr. sort (); Console. log (arr); // [1, 4, 7] Arr. sort (function (a, B ){ Return a-B; // from small to large }); Console. log (arr); // [1, 4, 7] Arr. sort (function (a, B ){ Return B-a; // from large to small }); Console. log (arr); // [7, 4, 1] Var num = new Array ('one', 'three ', 'six', 'five '); Num. sort (); // case sensitive sorting Console. log (num); // ["Five", "Six", "one", "three"] Num. sort (function (s, t ){ Var a = s. toLowerCase (); Var B = t. toLowerCase (); If (a <B) return-1; If (a> B) return 1; Return 0; }); Console. log (num); // ["Five", "one", "Six", "three"] |
4. concat ()
The Array. concat () method is created and a new Array is returned. Its elements include the elements of the original Array that calls concat () and each parameter of concat.
If any of these parameters is an array, the elements of the array are connected instead of the array.
Note that concat () does not recursively flatten the array. Concat () does not modify the called array.
1 2 3 4 5 6 7 |
Var arr = [1, 2, 3]; Console. log (arr. concat (4, 5); // [1, 2, 3, 4, 5] Console. log (arr); // [1, 2, 3] Console. log (arr. concat ([4, 5]); // [1, 2, 3, 4, 5] Console. log (arr. concat ([], []); // [1, 2, 3, 4, 5, 6, 7] Console. log (arr. concat ([4, [5, [6, 7]); // [1, 2, 3, 4, [5, [6, 7] Console. log (arr. concat (4, [5, [6, 7]); // [1, 2, 3, 4, 5, [6, 7] |
5. slice ()
The Array. slice () method returns a fragment or sub-Array of the specified Array. Its Two Parameters specify the start and end positions (a, B) of the fragment respectively ). The returned result is an array element that does not contain B from a to B.
If there is only one parameter (a), it indicates the elements from a to the end of the array.
If a negative value (-a) exists in the parameter, it indicates the position a relative to the last element in the array. For example, (-3) indicates the last and third elements to the end. If a negative number is displayed, it is first converted and then determined according to the range rules.
It also returns a new array without modifying the original array.
1 2 3 4 5 6 7 |
Var arr = [1, 2, 4, 5]; Console. log (arr. slice (0, 3); // [1, 2, 3] Console. log (arr); // [1, 2, 3, 4, 5] Console. log (arr. slice (3); // [4, 5] Console. log (arr. slice (-3); // [3, 4, 5] Console. log (arr. slice (-3,-1); // [3, 4] Console. log (arr. slice (2,-1); // [3, 4] |
6. splice ()
The Array. splice () method is a common method for inserting or deleting elements in an Array. It modifies the value of the original array and returns a new array sequence.
The first parameter of splice () specifies the start position of insertion or deletion, and the second parameter specifies the number of elements to be deleted from the array. If the second parameter is omitted, It is deleted to the end by default.
1 2 3 4 5 |
Var arr = [1, 2, 3, 4, 5, 6, 7, 8]; Console. log (arr. splice (4); // [5, 6, 7, 8] Console. log (arr); // [1, 2, 3, 4] Console. log (arr. splice (1, 2); // [2, 3] Console. log (arr); // [1, 4] |
The first two parameters of splice () Specify the array elements to be deleted. Any number of parameters followed by this parameter specifies the elements to be inserted into the array, and the insertion starts from the position represented by the first parameter.
Unlike the concat () above, splice () directly inserts an array, for example, the following [1, 2]
1 2 3 4 5 |
Var arr = [1, 2, 4, 5]; Console. log (arr. splice (2, 0, 'A', 'B'); // [] Console. log (arr); // [1, 2, "a", "B", 3, 4, 5] Console. log (arr. splice (2, 1, [1, 2], 3); // ["a"] Console. log (arr); // [1, 2, [1, 2], 3, "B", 3, 4, 5] |
7. push () pop () unshift () shift ()
Think of these methods as stack operations: the first two are normal Stack operations, and the latter two are reverse stack operations.
Push () and unshift () add elements from the back and front of the array, and return the length of the new array.
Pop () and shift () Delete the last and foremost elements in the array, and return the deleted elements.
1 2 3 4 5 6 7 8 9 10 |
Var arr = []; Console. log (arr. push (1, 2, 3); // 3 Console. log (arr); // [1, 2, 3] Console. log (arr. pop (); // 3 Console. log (arr); // [1, 2] Console. log (arr. push ([4, 5]); // 3 Console. log (arr); // [1, 2, [4, 5] |
1 2 3 4 5 6 7 8 9 10 |
Var arr = []; Console. log (arr. unshift (1, 2, 3); // 3 Console. log (arr); // [1, 2, 3] Console. log (arr. shift (); // 1 Console. log (arr); // [2, 3] Console. log (arr. unshift ([4, 5]); // 3 Console. log (arr); // [4, 5], 2, 3] |
(2) array method in ECMAScript5
Most of these array methods have uniform and general rules. They do not modify the original array.
The first parameter of most methods receives a function and calls this function once for each element (or element) of the array.
If it is a sparse array, the transmitted function is not called for nonexistent elements;
In most cases, the called function generally uses three parameters: array elements, element indexes, and arrays themselves. Generally, the last two parameters are not required.
In addition to the first parameter (function), there is a second parameter (Optional). If the second parameter exists, the called function is considered as the method of the second parameter.
That is to say, the second parameter passed in when a function is called is used as the value of its this keyword.
1. forEach ()
This method traverses the array from the beginning to the end and calls the specified function for each array.
1 2 3 4 5 6 7 8 |
Var data = [1, 2, 3, 4, 5]; Var sum = 0; Data. forEach (function (value) {// only the first parameter (function) is used. The called function only uses the array element of the first parameter. Sum + = value; }); Console. log (sum); // 15 Console. log (data); // [1, 2, 3, 4, 5] |
1 2 3 4 5 6 7 |
Var data = [1, 2, 3, 4, 5]; Var sum = 0; Data. forEach (function (value, item, data) {// The called function has three parameters Data [item] = value * value; // obtain the square }); Console. log (data); // [1, 4, 9, 16, 25] |
2. map ()
This method passes each element in the called array to the specified function and returns an array containing the return value of this function.
1 2 3 4 5 6 7 |
Var data = [1, 2, 3, 4, 5]; Var data1 = data. map (function (value ){ Return ++ value; }); Console. log (data); // [1, 2, 3, 4, 5] Console. log (data1); // [2, 3, 4, 5, 6] |
3. filter ()
The array element returned by this method is a subset of the called array. The passed function is used for logic determination. This function returns true or false.
If the returned value is true or can be converted to true, the element passed to the judgment function is a member of this subset and will be added to an array as the return value.
1 2 3 4 5 6 7 8 9 10 11 12 |
Var data = [1, 2, 3, 4, 5]; Var data1 = data. filter (function (value ){ Return value <= 3; }); Var data2 = data. filter (function (value ){ Return value> 3; }); Console. log (data); // [1, 2, 3, 4, 5] Console. log (data1); // [1, 2, 3] Console. log (data2); // [4, 5] |
4. every () and some ()
As the name implies, every () is returned when all elements in the array meet the conditions specified by the function. some () is returned when a certain element is satisfied.
1 2 3 4 5 6 7 8 9 10 11 12 |
Var data = [1, 2, 3, 4, 5]; Var data1 = data. every (function (value ){ Return value <4; }); Var data2 = data. some (function (value ){ Return value> 4; }); Console. log (data); // [1, 2, 3, 4, 5] Console. log (data1); // false Console. log (data2); // true |
5. reduce () and reduceRight ()
These two methods use the specified function to combine array elements to generate a single value.
Reduce () has two parameters. The first is the function that executes the simplification operation. That is to say, two values are reduced to one in some way and the simplified values are returned.
The second parameter is optional and is passed to the first parameter function as the initial value. If the second parameter does not exist, the initial value uses the first element value of the array.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
Var data = [1, 2, 3, 4, 5]; Var sum = data. reduce (function (a, B ){ Return a + B; }); Var sum1 = data. reduce (function (a, B ){ Return a + B; }, 5 ); Var min = data. reduce (function (a, B ){ Return (a <B )? A: B; }); Console. log (data); // [1, 2, 3, 4, 5] Console. log (sum); // 15 Console. log (sum1); // 20 Console. log (min); // 1 |
Sum does not have the second parameter, so the initial value is the first array element. Step 1 + 2 = 3, step 2 3 + 3 = 6... get 15
There is a second parameter in sum1, so the initial value is 5, step 5 + 1 = 6, step 6 + 2 = 8... finally get 20
ReduceRight () is similar to reduce (). The difference is that it processes arrays from high to low (from right to left) according to the array index, rather than from normal to high.
1 2 3 4 5 6 7 8 9 10 11 12 |
Var data = ['A', 'B', 'C']; Var str = data. reduce (function (x, y) {// order Return x + y; }); Var str1 = data. reduceRight (function (x, y) {// Reverse Order Return x + y; }); Console. log (data); // [1, 2, 3] Console. log (str); // "abc" Console. log (str1); // "CBA" |
6. indexOf () and lastIndexOf ()
This method is used to search for elements with a given value in the entire array, and returns the index of the element (if one value is found, it exits). If no value is found,-1 is returned.
One starts from beginning to end and one starts from end to end
1 2 3 4 5 6 7 8 |
Var data = ['A', 'B', 'A', 'C', 'a']; Console. log (data. indexOf ('A'); // 0 Console. log (data. indexOf ('D'); //-1 Console. log (data. lastIndexOf ('A'); // 4 Console. log (data. lastIndexOf ('A',-2); // 2 starts from the second to the last Console. log (data. lastIndexOf ('A', 1); // 0 from the second forward |
7. array type isArray ()
Determines whether an object is an array.
1 2 3 4 5 6 7 8 9 10 11 |
Console. log (Array. isArray ([]); // true Console. log (Array. isArray ({}); // false // Simulate the above Var isArray1 = Function. isArray | function (o ){ Return typeof o = "object "&& Object. prototype. toString. call (o) = "[object Array]"; }; Console. log (isArray1 ([]); // true Console. log (isArray1 ({}); // false |