1, add, delete and change (such all change the original array)

1, push

  • Definition: Appends an element to the end of an array
  • @params: Appended items (multiple of any type)
  • @return: Adds the length of the array
  • Whether to change the original array: Change

Usage: ary. Push (added item)

Var ary = [1, 2, 3]; var res=ary.push(6); ==>4 console.log(ary); = = = > [5]Copy the code

2, unshift

  • Definition: Adds an element to the beginning of an array
  • @params: Appended items (multiple of any type)
  • @return: Adds the length of the array
  • Whether to change the original array: Change

Usage: ary. Unshift (added item)

Var ary = [1, 2, 3]; var res=ary.unshift(6); ==>4 console.log(ary); = = = >,1,2,3 [6]Copy the code

3, the shift

  • Definition: Deletes the beginning item of an array
  • @ params: no
  • @return: The item to delete
  • Whether to change the original array: Change

Use: ary. Shift ()

Var ary = [1, 2, 3, 4, 5]; var res=ary.shift(); console.log(ary); console.log(res); / / = = > 1Copy the code

4, pop

  • Definition: Deletes the end item of an array
  • @ params: no
  • @return: The item to delete
  • Whether to change the original array: Change

Use: ary. Pop ()

Var ary = [1, 2, 3, 4, 5]; var res=ary.pop(); console.log(ary); console.log(res); / / = = > 5Copy the code

5, splice

  • Definition: the implementation of array increase, delete, modify;
  • @ params: n, m, x
  • @return: new array after modification
  • Whether to change the original array: Change

Splice (n,m,x)

Var ary = [1, 2, 3, 4, 5]; The console. The log (ary. Splice (0,2,6,8)); The console. The log (ary) = = >,8,3,4,5 [6];Copy the code

[Delete] The return value is an array of deleted items

  • Ary.splice (0): You can empty an array and store the contents of the original array based on the new array (similar to array cloning)
  • Ary. Splice (ary. Length-1): Deletes the last item
  • Ary. Splice (0,1): deletes the first item
Var ary = [1, 2, 3, 4, 5]; The console. The log (ary. Splice (0, 1)); The console. The log (ary) = = > 5-tetrafluorobenzoic [2];Copy the code

【 added 】 splice(n,0,x); Added the x term before the index n;

  • Ary.splice (ary. Length,0,x) : add an x item to the end of the array;
  • Ary.splice (0,0,x): add an x item to the beginning of the array;
Var ary = [1, 2, 3, 4, 5]; The console. The log (ary. Splice (0,0,8)); The console. The log (ary) = = >,1,2,3,4,5 [8];Copy the code

[Modified] replace m with x

Ways to remove an item from the end of an array

  • arr.length–
  • Arr.pop () : Returns the item deleted as a result
  • Arr.splice (arr.length-1) : Returns [deleted item]
  • Delete arr[arr.length-1] : delete arr[arr.length-1] :

Several ways to append items to the end of an array

  • Arr. push(” added item “)
  • Arr [arr.length]=” add item”
  • Arr.splice (arr.length, 0, “incrementing item “)

Query and concatenation (this class does not change the original array)

6, slice

  • Definition: implement an array query
  • @params: n,m // Start with index n and find index m (not including m)
  • @return: Returns the found contents as a new array
  • Change array or not: no change

Slice (n,m)

Var ary = [1, 2, 3, 4, 5]; Var res = ary. Slice (1, 3); = = > [2, 3]Copy the code

Ary.slice (0): m is not written to the end of the array

Consider: 1. What happens if n/m is negative, what happens if n>m, what happens if it’s a decimal, what happens if it’s non-significant, what happens if the value of m or n is larger than the maximum index?

  • 1. What happens if n over m is negative?
parameter describe
start The starting index of the fragment to be extracted. If it is negative, this parameter specifies the position from the end of the string. That is, -1 is the last character in the string, -2 is the penultimate character, and so on.
end The subscript that follows the end of the fragment to be extracted. If this parameter is not specified, the substring to extract includes start to the end of the original string. If this parameter is negative, it specifies the position from the end of the string.
  • N >m: returns an empty array;
  • 3, n,m if it is a decimal: will only take the integer before the decimal point, regardless of the number after the decimal point is a few are directly omitted;
letAry,8,7,3,6,4 ary = [1]. Slice (1.3, 4.2); //= > [8, 7, 3] ary.slice(1.6,4.9); / / = = > [8, 7, 3] ary. Slice (1, 4); / / = = > [8, 7, 3]Copy the code
  • 4. If it is not a significant Number, it will first convert the Number to a Number and then intercept it
letAry = [1,8,7,3,6,4] undefined."sss"."sss"); //==> [] ary.slice("1"."3"); //==> [8, 7] ary.slice(false.true); //==> [1] ary.slice([],[4]); //==>[1, 8, 7, 3] ary.slice({},{a:b}); //==>Uncaught ReferenceError: b is not defined ary.slice(NaN,2); / / = = > [8] 1,Copy the code
  • 5. What if the value of m or n is larger than the maximum index: if n is larger than the index, return an empty array; When n is less than the index, and m is greater than the index, we return items from index n to the end of the array;
Ary. Slice (8, 3); / / = = > [] ary. Slice (1, 8); //==>[8, 7, 3, 6, 4]Copy the code

7, concat

  • Definition: Implement array concatenation (merge)
  • @params: Concatenated item (multiple arbitrary values)
  • @return: New array after concatenation
  • Change array or not: no change

How to use: ary. Concat

letAry1 = [10, 30];let40,50,60 ary2 = [];let res=ary1.concat("Training", ary2); console.log(res); / / = = > [10, 30,"Training", 40,50,60]Copy the code
  • Ary.concat () : Equivalent to array clone (usually not used in real projects)
  • Ary.concat (‘ 1 ‘) : Passing a value is also equivalent to apending an item to the end of an array (not normally used for real items)

Convert an array to a string (this class does not change the array)

8 the toString.

  • Definition: converts an array to a string
  • @ params: no
  • @return: The converted string, with each item separated by a comma
  • Change array or not: no change

Use: ary.tostring ()

letAry = [10, 30];letres = ary.toString(); console.log(res); / / = = >"10, 30"console.log([].toString()); / / = = >""console.log([12].toString()); / / = = >"12"
Copy the code

9, the join

  • Definition: converts an array to a string
  • @params: Join with the specified delimiter
  • @return: The converted string
  • Change new array or not: No change

Use: ary. Join (‘ specify separator ‘)

Var ary = [1, 2, 3] var res = ary. Join ("-"); = = = >"1-2-3"
Copy the code
  • Ary. Join (“) : ‘123’
  • Ary. Join () : Undefined separator separated by a comma
  • Ary. Join (‘ + ‘); //==>’1+2+3’ console.log(eval(res)); //======eval: convert a string into a JS expression (addition, subtraction, multiplication, and division)

Check whether the array contains an item (this class does not change the original array)

10, indexOf

  • Definition: The index value that detects the first occurrence of the current item in an array
  • Params: This item to retrieve
  • @return: The index value (number) of the location where this item appears. If there is no such item in the array, the result returned is -1
  • Change array or not: no change

Usage: ary. IndexOf (retrieved item);

letAry =,20,30,10,20,30 [10]; console.log(ary.indexOf(20)); / / = = > 1Copy the code
  • Want to verify that the ARY contains “training”
if(ary. IndexOf ("Training")===-1) {// no includes}if(ary. Includes ("Training") {// contains: returns TRUE if there is one}Copy the code
  • Note: Not compatible in IE6-8

11, lastIndexOf

  • Definition: The index value that detects the last occurrence of the current item in an array
  • The rest of the content is the same with indexOf

12, includes

  • Definition: Checks whether the current array contains an item
  • Params: This item to retrieve
  • Return: Boolean, true yes, false no
  • Change array or not: no change

To use: ary. Includes (retrieved items)

Var ary = [1, 2, 3] ary. Includes (1); = = = >true
Copy the code
  • Note: ES6 syntax, not compatible in IE6-8

5. Sort or arrange (this class changes the original array)

13, reverse

  • Definition: To arrange an array upside down
  • @ params: no
  • @return: New array after permutation
  • Whether to change the original array: Change

Use: ary. Reverse ()

Var ary = [1, 2, 3, 4, 5]; var res=ary.reverse(); = = >,4,3,2,1 [5]; console.log(res,ary); = = = >,4,3,2,1 [5];Copy the code

14 and sort

  • Definition: To place an array in size order
  • @params: It could be none or it could be a function
  • @return: The sorted array
  • Whether to change the original array: Change

Use: ary.sort() : if you do not pass an argument to the sort method, it is not possible to sort numbers above 10 (it defaults to the first character of each item, which is not what we want).

  • To SORT multiple bits properly, we need to pass a function to SORT that returns a-b for ascending order and b-a for descending order:
  • ary.sort(function(a,b){return a-b; });
  • Ary.sort ((a,b) => a-b);

“Ascending”

,12,1,2,3 var ary = [11]; ary.sort(function(a,b){
    return a-b;
});
Copy the code

“Descending”

,12,1,2,3 var ary = [11]; ary.sort(function(a,b){
    return b-a;
});
Copy the code

Traversal and mapping (this class does not change the array)

15, forEach

  • Definition: To iterate over each item in a group
  • @params: Callback function
  • @ return: no/undefined
  • Change array or not: no change

ForEach (function(item,index){alert(item); })

Var ary =,1,3,5,6,7,8,2 [2]; var res=ary.forEach(function(item,index){
    alert(item);
})
console,log(res)
Copy the code
  • Ary. ForEach ((item,index)=>{console.log(‘ index: ‘+index+’ item: ‘+item); })
Ary.foreach ((item,index)=>{// the function is executed as many times as there are items in the array by default // Each time: item is the current item in the array,index is the index of the current item console. Log (Index:+index+'Content:'+ item); })Copy the code
  • For (let I = 0; i
for(letI = 0; i<ary.length; I ++) {// I: the index of the current loop //ary[I]: the index of the loop console.log(Index:+i+'Content:'+ary[i]);
}
Copy the code

16, the map

  • Definition: Array mapping
  • @params: Callback function
  • @return: New array after mapping
  • Change array or not: no change

Ary.map (function(item,index){return “”; })

Var ary = var res,1,3,4 [2] = ary. The map (function(item,index){
    return "You're so good."
})
["You're so good."."You're so good."."You're so good."."You're so good."]
Copy the code

Other methods follow up……

Array methods to complement: Arrays of common methods [add reduce, filter, flat…] | With a mind map