Common JavaScript Object Array (2)

Common JavaScript Object Array (2)
Array join method array concatenation concat method array sharding slice Method powerful splice method indexOf and lastIndexOf method several commonly used iterative method array join method

We know that the toString () and toLocaleString () Methods of the array return an array string separated by commas. But if we want the separator to be not a single comma, we can use the join () method. The join () method can accept a parameter, which is the expected separator, for example:

var colors = ["red", "blue", "white"];alert(colors.join("？"));

You will get:

red？blue？white

If you do not specify parameters for the join () method:

alert(colors.join());

By default, comma is used as the separator:

red,blue,white

Array concatenation concat Method

We know that there is a concat () method used for String concatenation in the string operation method, and this method is also used for Array concatenation in the array.

A significant difference between JS and Java is that when Java and other languages call a function, the parameters of the input function must be strictly consistent with the function signature created in advance. In JS, the parser does not check the data type of the input parameter, and does not even check the data type of several input parameters. When using the concat () method, we can:

Input one or more arrays as parameters. The concat () method first creates a copy of the original array, and then adds the arrays passed as parameters to the end of the new array in sequence, the last copy is returned.

If one or more non-array values are input as parameters, the concat () method creates a copy of the original array and then operates on the copy, add the input values to the end of the copy in sequence and return the results.

Input a combination of one or more arrays and values. The operation method is the same as above.

In fact, JS does not require the input parameter data type and number of parameters, and the elements in arrays in JS can be different. In fact, the concat () method can use one or more parameters of any type to concatenate arrays, although this is not necessary in many cases. I personally think this is the freedom that JS gives us, but it is not easy to make good use of it.

Note that the concat () method does not modify the original array, but creates a copy of the original array, operates on the copy, and then returns the new array as the return value. Here is an extreme example:

function test() {  var arr = [];  var colors = ["red", "blue", "white"];  var hello = function() {    alert("hello world!");  }  arr = arr.concat(colors, false, 1, undefined, "yellow", ["gray", "black"], hello);  alert(arr);}   

The above Code uses the concat () method of the array and Concatenates the arr of the empty array in sequence.Array colors,Boolean Type false,Numeric type 1,UndefinedType,String type yellow,Array ["gray," black "]And a function.

The code output is as follows:

Array splitting slice Method

The slice () method is used to split the specified range of an array. It can accept one or two parameters. These two Parameters specify the start and end positions for splitting.

If only one parameter is input, the array at the end of the array is returned.

When two parameters are input, the Child array from the first to the second parameter range is put back. (Elements that do not contain the second parameter position)

For example:

function test() {  var colors = ["red", "blue", "white", "gray", "green", "gold", "orange"];  var col1 = colors.slice(2);  var col2 = colors.slice(1, 4);  alert(colors + "\n" + col1 + "\n" + col2);}   

Output:

We can see that the slice () method does not change the value of the original colors array, and the split array does not contain the corresponding items of the second parameter.

The parameter passed in by the slice () method can be a negative number, which indicates the offset starting from the end. The method for determining the position is to add the array length to this parameter. For example, if the length of an array is 10, slice (-3,-1) and slice (7, 9) are equivalent.

In addition, when the second parameter is smaller than the first parameter, this method returns an empty array.

Powerful splice Method

The splice () method can delete the specified items in the array and insert the specified items at the specified position in the array. You can also combine the delete and insert operations to replace a specified item at a specified position.

Delete a specified item

The splice () method accepts two parameters. The first parameter specifies the start position of the deletion, and the second parameter specifies the number of items to be deleted. This method returns an array composed of deleted items. If no items are deleted, an empty array is returned.

function test() {  var colors = ["red", "blue", "white", "gray", "green", "gold", "orange"];  var col1 = colors.splice(1, 3);  alert(colors + "\n" + col1);}

Output:

Insert a specified item

To insert a specified entry into the array, the splice () method must accept three parameters. The first parameter specifies the start position of the insert, the second parameter is the number of items to be deleted (we set it to 0 here, that is, no items are deleted), and the third parameter is the item to be inserted. For example:

function test() {  var colors = ["red", "blue", "white", "gray", "green"];  var col1 = colors.splice(1, 0, "brown", "orange");  alert(colors + "\n" + col1);}

Output:

Col1 is an empty array.

Replace specified item

In fact, in the insert operation of a specified item, the second parameter is set to a non-zero value to delete some items and then insert the specified items here, thus completing the replacement function.

IndexOf and lastIndexOf Methods

The functions of these two methods are to find the location of a specified item in the array. They all accept 1 ~ Two parameters. The second parameter is optional.

The first parameter specifies the item to be searched, and the second parameter specifies the start position of the search. However, the indexOf method looks back from the array header, and the lastIndexOf method looks forward from the end of the array. If the search is successful, a matched position is returned. Otherwise,-1 is returned.

It should be emphasized that the search is successful here and the specified item is full (=) rather than "= ".

Here is a simple example:

  var colors = ["red", "blue", "gray", "white", "gray", "blue", "red"];  var ind1 = colors.indexOf("gray");  var ind2 = colors.indexOf("gray", 3);  var ind3 = colors.lastIndexOf("gray");  var ind4 = colors.lastIndexOf("gray", 3);

In the preceding code, ind1 equals 2, ind2 equals 4, ind3 equals 4, and ind4 equals 2.

Several common Iteration Methods

In JS, there is a convenient way to implement array iteration. The five iteration methods described below receive 1 ~ Two parameters. The first parameter specifies the function to be executed on each item of the array. The second parameter is not required and specifies the scope object for running the function. The function Acting on each item of the array needs to receive three parameters: the value of the array item, the position of the item in the array, and the array itself. Abstract:

We can use the forEach () method (similar to the for loop in many other languages) to perform some basic operations on each traversal of an array. This method does not return a value. For example, add 1 to each item of the array:

var num = [1, 2, 3, 4, 5, 6, 7];var forfun = function(item, ind, array) {  array[ind] += 1;}var rst = num.forEach(forfun);alert(num);

The following output is displayed:

If we want to check whether each item of the array meets certain conditions, we can use the every () method. If all the items in the array meet the conditions, true is returned. Otherwise, false is returned.

var num = [1, 2, 3, 4, 5, 6, 7];var everfun = function(item, ind, array) {  return (item > 3)；}var rst = num.every(everfun);

The code above checks whether each item in the array is greater than 3. The every () method returns true only when each item in the array meets the conditions. Obviously, the previous example returns false.

If we want to check whether some items in the array meet certain conditions, we can use the some () method. Unlike every (), when some items in the array meet the conditions, returns true.

var num = [1, 2, 3, 4, 5, 6, 7];var somefun = function(item, ind, array) {  return (item > 3)；}var rst = num.some(somefun);

If an array contains more than 3 items, the rst value returns true.

If we want to filter out items that meet certain conditions in the array, we can use the filter () method. This method will return items that meet the conditions in the array (return true items) A new array.

var num = [1, 2, 3, 4, 5, 6, 7];var filterfun = function(item, ind, array) {  return (item > 3);}var rst = num.filter(filterfun);alert(num + "\n" + rst);

The following output is displayed:

1,2,3,4,5,6,74,5,6,7

If you want to perform a ing operation on the array, that is, to perform a total operation on each item of the array and return the operation result, you can use the map () method. For example, we can map an array to a truth table with a value greater than 3:

var num = [1, 2, 3, 4, 5, 6, 7];var mapfun = function(item, ind, array) {  return (item > 3);}var rst = num.map(mapfun);alert(num + "\n" + rst);

The following output is displayed: