one .JavaScript How arrays are created in
(1) use Array Constructor :
var arr1 = new Array(); // Create an empty array var arr2 = new Array(10); // Create a containing 20 Array of items
var arr3 = new Array("zs","ls","ww"); // Create a containing 3 An array of strings
(2) Use array literal notation :
var arr4 = []; // Create an empty array var arr5 = [10]; // Create a containing 1 Array of items var arr6 =
["zs","ls","ww"]; // Create a containing 3 An array of strings
two , Overview of array methods
Whether the method name function original array is changed
join() Use separator , Converts an array to a string and returns n
pop() Delete last digit , And return the deleted data y
shift() Delete first digit , And return the deleted data y
push Add one or more data at the end , Return length y
unshift() Add one or more data in the first place , Return length y
concat() Merge array , And return the merged data n
slice() Intercepts the array at the specified location , And return n
sort() sort ( Character rule ), Return results y
reverse() Invert array , Return results y
toString() Convert directly to string , And return n
splice() Delete specified location , And replace , Return deleted data y
valueOf() Returns the original value of an array object n
indexOf() Query and return the index of data n
lastIndexOf() Reverse query and return the index of data n
forEach() The parameter is a callback function , Will traverse all the items of the array , The callback function accepts three parameters , Respectively value,index,self;forEach no return value n
map() with forEach, At the same time, the callback function returns data , Make up a new array by map return n
filter() with forEach, At the same time, the callback function returns a Boolean value , by true The new array consists of filter return n
every() with forEach, At the same time, the callback function returns a Boolean value , All for true, from every return truen
some() with forEach, At the same time, the callback function returns a Boolean value , As long as one is true, from some return truen
reduce() Merge , with forEach, Iterates over all items of the array , And build a final value , from reduce return n
reduceRight() Reverse merge , with forEach, Iterates over all items of the array , And build a final value , from reduceRight return n
findIndex()
Find the subscript of the first eligible element in the array and no longer traverse
n
three , Detailed explanation of method
1.join()
function : Puts all the elements in the array into a string according to the specified separator , And return this string .
parameter :join(str); Parameter optional , Default to "," number , Use the incoming character as the separator .
var arr = [1,2,3]; console.log(arr.join()); //1,2,3
console.log(arr.join("-")); //1-2-3
adopt join() Method can implement duplicate strings , Just pass in the string and the number of repetitions , You can return the repeated string , The function is as follows :
function repeatString(str, n) { return new Array(n + 1).join(str); }
console.log(repeatString("abc", 3)); // abcabcabc
console.log(repeatString("Hi", 5)); // HiHiHiHiHi
2.pop()
pop(): Remove the last item from the end of the array , Reduce the number of arrays length value , Then return the removed item
ar arr = [1,2,3]; console.log(arr.pop()); //3 console.log(arr); //[1,2]--- Original array change
3.shift()
function : Method is used to delete and return the first element of the array .
var arr = [1,2,3] console.log(arr.shift()); //1 console.log(arr);
//[2,3]--- Original array change
4.push()
function : Adds one or more elements to the end of the array , And returns the new length .
var arr = [1,2,3]; console.log(arr.push("hello")); //4 console.log(arr);
//[1,2,3,"hello"]--- Original array change console.log(arr.push("a","b")); //6 console.log(arr);
//[1,2,3,"hello","a","b"]--- Original array change
5.unshift()
function : Adds one or more elements to the beginning of the array , And returns the new length .
var arr = [1,2,3]; console.log(arr.unshift("hello")); //4 console.log(arr);
//["hello",1,2,3]--- Original array change console.log(arr.unshift("a","b")); //6
console.log(arr); //["a","b","hello",1,2,3]--- Original array change
6.concat()
function : Add parameters to the original array . This method will first create a copy of the current array , Then add the received parameters to the end of the copy , Finally, the newly constructed array is returned . I didn't give it
concat() Method to pass parameters , It simply copies the current array and returns a copy .
const arr1 = [1,2,3]; const arr2 = [4,5,6]; const arr3 = arr1.concat(arr2);
console.log(arr3); //[1,2,3,4,5,6]
7.slice()
function : Returns a new array of items from the specified start subscript to the end subscript in the original array .
slice() Method can accept one or two parameters , That is to return the start and end positions of the item . When there is only one parameter ,
slice() Method returns all items from the position specified by the parameter to the end of the current array . If there are two parameters , This method returns an item between the start and end positions —— But does not include items at the end position .
var arr = [1,3,5,7,9,11]; var arrCopy1 = arr.slice(1); var arrCopy2 =
arr.slice(1,4); var arrCopy3 = arr.slice(1,-2); var arrCopy4 =
arr.slice(-4,-1); console.log(arr); //[1, 3, 5, 7, 9, 11]( The original array has not changed )
console.log(arrCopy1); //[3, 5, 7, 9, 11] console.log(arrCopy2); //[3, 5, 7]
console.log(arrCopy3); //[3, 5, 7] console.log(arrCopy4); //[5, 7, 9]
8.sort()
function : Sort the elements in the array , The default is ascending .
var arr = [6,1,5,2,3]; console.log(arr.sort()); //[1, 2, 3, 5, 6]
console.log(arr); //[1, 2, 3, 5, 6]--- Original array change
9.reverse()
function : Reverse the order of array items .
var arr = [13, 24, 51, 3]; console.log(arr.reverse()); //[3, 51, 24, 13]
console.log(arr); //[3, 51, 24, 13]( Original array change )
10.toString()
function : Convert to string , Similar to without parameters join(). This method is called automatically when implicit type conversion occurs to the data , If called manually , Is directly converted to a string .
var arr = [1,2,3]; console.log(arr.toString()); //1,2,3 console.log(arr);
//[1,2,3]--- Original array unchanged
11.splice()
function : Very powerful array method , It has many uses , Can be deleted , Insert and replace .
delete : You can delete any number of items , Just specify 2 Parameters : The location of the first item to delete and the number of items to delete . for example , splice(0,2) The first two items in the array are deleted .
insert : You can insert any number of items into a specified location , Just provide 3 Parameters : Starting position ,
0( Number of items to delete ) And items to insert . for example ,splice(2,0,4,6) From the position of the current array 2 Start insertion 4 and 6.
replace : You can insert any number of items into a specified location , And delete any number of items at the same time , Just specify 3
Parameters : Starting position , The number of items to delete and any number of items to insert . The number of items inserted does not have to be equal to the number of items deleted . for example ,splice (2,1,4,6) Deletes the current array position 2
Item , Then from the position 2 Start insertion 4 and 6.
splice() Method always returns an array , The array contains items that were removed from the original array , If no items are deleted , Returns an empty array .
var arr = [1,3,5,7,9,11]; var arrRemoved = arr.splice(0,2); console.log(arr);
//[5, 7, 9, 11] console.log(arrRemoved); //[1, 3] var arrRemoved2 =
arr.splice(2,0,4,6); console.log(arr); // [5, 7, 4, 6, 9, 11]
console.log(arrRemoved2); // [] var arrRemoved3 = arr.splice(1,1,2,4);
console.log(arr); // [5, 2, 4, 4, 6, 9, 11] console.log(arrRemoved3); //[7]
12.valueOf()
function : Returns the original value of the array ( In general, it is the array itself ), Generally by js Called in the background , Does not appear explicitly in the code
var arr = [1,2,3]; console.log(arr.valueOf()); //[1,2,3] console.log(arr);
//[1,2,3] // To prove that it is the array itself that is returned console.log(arr.valueOf() == arr); //true
13.indexOf()
function : According to the specified data , From left to right , Where the query appears in the array , If the specified data does not exist , return -1. This method is a query method , The array will not be changed .
parameter :indexOf(value,
start);value For the data to query ;start Is optional , Indicates where to start the query , When start When negative , Count forward from the end of the array ; If not found value Existence of , The method returns -1
var arr = ["h","e","l","l","o"]; console.log(arr.indexOf("l")); //2
console.log(arr.indexOf("l",3)); //3 console.log(arr.indexOf("l",4)); //-1
console.log(arr.indexOf("l",-1)); //-1 console.log(arr.indexOf("l",-3)); //2
14.lastIndexOf()
function : According to the specified data , Right to left , Where the query appears in the array , If the specified data does not exist , return -1. This method is a query method , The array will not be changed .
parameter :lastIndexOf(value,
start);value For the data to query ;start Is optional , Indicates where to start the query , When start When negative , Count forward from the end of the array ; If not found value Existence of , The method returns -1
var arr = ["h","e","l","l","o"]; console.log(arr.lastIndexOf("l")); //3
console.log(arr.lastIndexOf("l",3)); //3 console.log(arr.lastIndexOf("l",1));
//-1 console.log(arr.lastIndexOf("l",-3)); //2
console.log(arr.lastIndexOf("l",-4)); //-1
15.forEach()
function : Loop through the array , Runs the given function on each item in the array . This method has no return value .
parameter : All function type , By default, there are transfer parameters , The parameters are : Traversal array contents ; Array index corresponding to the second row , Array itself .
var arr = [1, 2, 3, 4, 5]; arr.forEach(function(x, index, a){ console.log(x +
'|' + index + '|' + (a === arr)); }); // Output as : // 1|0|true // 2|1|true //
3|2|true // 4|3|true // 5|4|true
16.map()
function : Runs the given function on each item in the array , Returns an array of the results of each function call .
Use if you want every value in the array to change map
let arr = [10, 30, 50, 60, 120, 230, 340, 450] let newArr = arr.map(n => {
return n * 2 }) console.log(newArr);
17.filter()
function : filter , Each item in the array runs the given function , Returns an array that meets the filtering conditions .
var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]; var arr2 = arr.filter(function(x,
index) { return index % 3 === 0 || x >= 8; }); console.log(arr2); //[1, 4, 7,
8, 9, 10]
18.every()
function : Determine whether each item in the array meets the condition , Only all items meet the condition , Will return true.
var arr = [1, 2, 3, 4, 5]; var arr2 = arr.every(function(x) { return x < 10;
}); console.log(arr2); //true var arr3 = arr.every(function(x) { return x < 3;
}); console.log(arr3); // false
19.some()
function : Determine whether there are items in the array that meet the conditions , As long as one of the conditions is met , Will return true.
var arr = [1, 2, 3, 4, 5]; var arr2 = arr.some(function(x) { return x < 3; });
console.log(arr2); //true var arr3 = arr.some(function(x) { return x < 1; });
console.log(arr3); // false
20.reduce()
function : Start with the first item of the array , Traverse to the end one by one , Iterates over all items of the array , Then build a final returned value .
parameter :
The first parameter is :accumulator Is the current aggregate value ,
The second parameter is : current Is the current element when the array loops
The third parameter is : index Is the index value of the array element
The fourth parameter is : Array Is the array itself
int : yes accumulator Initial value of You can set it yourself
The first two parameters are commonly used , The latter two parameters are not commonly used , The common usage scenario is the summation of arrays
// effect : Summarize all the contents of the array At least two values should be passed let arr = [10, 30, 50, 60, 120, 230, 340, 450]
let newArr = arr.reduce((pre, n) => { return pre + n }, 0) console.log(newArr);
21.reduceRight()
function :( And reduce similar ) Start with the last item in the array , Traverse forward one by one to the first bit , Iterates over all items of the array , Then build a final returned value .
parameter : with reduce.
var arr = [1,2,3,4,5]; var sum = arr.reduceRight(function(pre, cur, index,
array){ return pre + cur; },10); console.log(sum); //25
22.findIndex()
function : Returns the index of the first element in the array that satisfies the provided test function . If not, return -1.
let arr = [10, 2, 9, 17, 22]; let index = arr.findIndex((item) => item > 13)
console.log(index); // 3
Technology