Catalog

Be careful:
Directory can be clicked to jump (it's not blue, I'm afraid you don't know)
Mobile terminal, can't jump

Es3 (including previous)

1. concat
2. pop
3. push
4. shift
5. unshift
6. reverse
7. sort
8. join
9. slice
10. splice
11. toLocaleString
12. toString
13. toSource

ES5

1. Array.isArray
2. indexOf
3. lastIndexOf
4. every
5. some
6. forEach
7. map
8. filter
9. reduce
10. reduceRight

ES6(ES2015)

1. entries
2. keys
3. values
4. Array.from
5. Array.of
6. find
7. findIndex
8. fill
9. copyWithin

ES2016

1. includes

ES2019

1. flat
2. flatMap

1. Array.prototype.concat()

Definition and usage:
The concat() method is used to combine two or more arrays. This method does not change the existing array, but returns a new array (as you can see, it is a pure function).

Syntax:
arrayObject.concat(arrayX,arrayX,......,arrayX)

parameter	describe
arrayX	Necessary. This parameter can be a specific value or an array object. It can be any number.

Return value: returns a new array

Code example:

var arr1 = [1,2,3];
var arr2 = arr1.concat(4,5);
console.log(arr1);  // [ 1, 2, 3 ]
console.log(arr2);  // [ 1, 2, 3, 4, 5 ]

var arr1 = [1,2,3];
var arr2 = [4,5];
var arr3 = arr1.concat(arr2);
console.log(arr3);  // [ 1, 2, 3, 4, 5 ]

2. Array.prototype.pop()

The pop() method removes the last element from the array and returns the value of that element. This method changes the length of the array.
Code example:

const arr = ['a', 'b', 'c'];
console.log(arr.pop());
// c
console.log(arr);
// ["a", "b"]

3.Array.prototype.push()

The push() method adds one or more elements to the end of the array and returns the new length of the array.
Code example:

const arr = ['a', 'b', 'c'];
console.log(arr.push('d'));
// 4
console.log(arr);
// ["a", "b", "c", "d"]

4. Array.prototype.shift()

The shift() method removes the first element from the array and returns the value of that element. This method changes the length of the array.

const arr = ['a', 'b', 'c'];
console.log(arr.shift());
//  a
console.log(arr);
//  ["b", "c"]

5. Array.prototype.unshift()

The unshift() method adds one or more elements to the beginning of the array and returns the new length of the array (the method modifies the original array).

const arr = ['a', 'b', 'c'];
console.log(arr.unshift('d'));
//  a
console.log(arr);
//   ["d", "a", "b", "c"]
console.log(arr.unshift(1,2));
// 6
console.log(arr);
// [1, 2, "d", "a", "b", "c"]

6. Array.prototype.reverse()

The reverse() method reverses the position of the elements in the array and returns the array. This method changes the original array.

const arr = ['a', 'b', 'c'];
console.log(arr.reverse());
//  ["c", "b", "a"]
console.log(arr);
//  ["c", "b", "a"] 

7. Array.prototype.sort()

The sort() method is used to sort the elements of an array and return the array.
Syntax:
arrayObject.sort(sortby)

parameter	describe
sortby	Optional. Specifies the sort order. Must be a function.

Return value:
A reference to an array. Note that the array is sorted on the original array and no copies are generated.

Note: the default sort order is based on the string UniCode code. Because sorting is based on the order of the string UniCode code
So there are the following results:

const arr = [1,4,13,3,11,2,22,9];
arr.sort();
console.log(arr);
// [1, 11, 13, 2, 22, 3, 4, 9]

The solution is to pass in the comparison function as follows:
Ascending order:

const arr = [1,4,13,3,11,2,22,9];
arr.sort((a,b) => a-b);
console.log(arr);
//   [1, 2, 3, 4, 9, 11, 13, 22]

Descending order:

const arr = [1,4,13,3,11,2,22,9];
arr.sort((a,b) => b-a);
console.log(arr);
//   [22, 13, 11, 9, 4, 3, 2, 1]

8. Array.prototype.join()

The join() method is used to put all elements in an array into a string.
Elements are separated by the specified separator (comma by default).

Code example:

const arr = ['a', 'b', 'c'];
console.log(arr.join());
// a,b,c
console.log(arr.join(''));
// abc
console.log(arr.join('-'));
// a-b-c

9. Array.prototype.slice()

The slice() method returns the selected element from an existing array.
Syntax: arrayObject.slice(start,end)
Return value: returns a new array containing the elements in the arrayObject from start to end (excluding the element).

const arr = [10, 20, 30, 40, 50]

const arr1 = arr.slice()
console.log(arr1) // [10, 20, 30, 40, 50]

const arr2 = arr.slice(1, 4)
console.log(arr2) // [20, 30, 40]

const arr3 = arr.slice(2)
console.log(arr3) // [30, 40, 50]

const arr4 = arr.slice(-3) //Negative values can be used to pick elements from the end of an array.
console.log(arr4) // [30, 40, 50]

10. Array.prototype.splice()

The splice() method adds / removes items to / from the array, and then returns the deleted items.
This method changes the original array.

const arr = [10, 20, 30, 40, 50]

// splice non pure function
const spliceRes = arr.splice(1, 2, 'a', 'b', 'c')
console.log(spliceRes, arr) //[20,30] [10, 'a', 'b', 'c', 40, 50]

const spliceRes1 = arr.splice(1, 2)
console.log(spliceRes1, arr)//[20,30] [10, 40, 50]

const spliceRes2 = arr.splice(1, 0, 'a', 'b', 'c')
console.log(spliceRes2, arr)//[] [10, "a", "b", "c", 20, 30, 40, 50]

11. Array.prototype.toLocaleString()

toLocaleString() returns a string representing the elements in the array. The elements in the array are converted to strings using their respective toLocaleString methods, which are separated by a locale specific string (such as a comma "," for example).

const array1 = [1, 'a', new Date('21 Dec 1997 14:12:00 UTC')];
const localeString = array1.toLocaleString('en', {timeZone: "UTC"});

console.log(localeString);

12. Array.prototype.toString()

toString() returns a string representing the specified array and its elements.

const array1 = [1, 2, 'a', '1a'];
console.log(array1.toString());
// 1,2,a,1a

13. Array.prototype.toSource()

This feature is non-standard, please try not to use it in the production environment!
(don't use it, I'll put it here for a look.)
Returns a string representing the source code of the array

var alpha = new Array("a", "b", "c");
alpha.toSource();   //Return to ["a", "b", "c"]

14. Array.isArray()

Array.isArray() is used to determine whether the passed value is an array.

console.log(Array.isArray([1, 2, 3]));  
// true
console.log(Array.isArray({foo: 123})); 
// false
console.log(Array.isArray("foobar")) ;   
// false

15. Array.prototype.indexOf()

The indexOf() method returns the first index in the array where a given element can be found, or - 1 if it does not exist.

const arr = ['a','b','c','a'];
console.log(arr.indexOf('a'));
// 0
console.log(arr.indexOf('f'));
// -1

16. Array.prototype.lastIndexOf()

The lastIndexOf() method returns the last index of the specified element (that is, a valid JavaScript value or variable) in the array, or - 1 if it does not exist. Looks up from the back of the array.

const arr = ['a','b','c','a'];
console.log(arr.lastIndexOf('a'));
// 3
console.log(arr.indexOf('f'));
// -1

17. Array.prototype.every()

The every() method is used to check whether all elements of the array meet the specified conditions (provided by the function)
The every() method uses the specified function to detect all elements in the array:

• If one element in the array is not satisfied, the entire expression returns false, and the remaining elements are not detected.
• Returns true if all elements meet the criteria.

Be careful:
If you receive an empty array, this method returns true in all cases.
every() does not change the original array.

const fun1 = (i) => i < 10;
const fun2 = (i) => i > 10;
const arr = [1, 2, 3];
console.log(arr.every(fun1));
// true
console.log(arr.every(fun2));
// false
const arr1 = [1,2,3,11];
console.log(arr1.every(fun1));
// false

18. Array.prototype.some()

The some() method is used to detect whether the elements in the array meet the specified conditions (provided by the function)
The some() method executes each element of the array in turn:

• If one element satisfies the condition, the expression returns true, and the remaining elements will not be detected again
• Returns false if there are no elements that meet the criteria

Be careful:
If you test with an empty array, it returns false in any case
`some() 'will not change the original array

const fun1 = (i) => i < 10;
const fun2 = (i) => i > 20;
const arr = [1, 11, 12];
console.log(arr.some(fun1));
// true
console.log(arr.some(fun2));
// false

19. Array.prototype.forEach()

The forEach() method is used to call each element of the array and pass the element to the callback function
Note: forEach() does not perform a callback function for an empty array

const arr = [1,2,3];
arr.forEach(i => console.log(i));
// 1
// 2
// 3

20. Array.prototype.map()

The map() method returns a new array. The elements in the array are the values processed by the original array element calling the function.
The map() method processes the elements in order of the original array elements.
Be careful:
map() does not detect empty arrays.
map() does not change the original array.

const arr = [1,2,3];
const map =  arr.map(i => i*2);
console.log(map);
// [2, 4, 6]
console.log(arr)
// [1, 2, 3]

21. Array.prototype.filter()

The filter() method creates a new array by checking all the elements in the specified array that meet the criteria.
Be careful:
filter() does not detect empty arrays.
filter() does not change the original array

const arr = [1,2,3,4,5,6];
const result =  arr.filter(i => i>3);
console.log(result);
// [4, 5, 6]
console.log(arr)
// [1, 2, 3, 4, 5, 6]

22. Array.prototype.reduce()

The reduce() method takes a function as an accumulator, and each value in the array (from left to right) starts to be reduced and finally evaluates to a value.
reduce() can be used as a higher-order function for the function's compose.
Be careful:
reduce() does not perform a callback function for an empty array.

const array1 = [1, 2, 3, 4];
const reducer = (total, currentValue) => total + currentValue;

// 1 + 2 + 3 + 4
console.log(array1.reduce(reducer));
// expected output: 10

// 5 + 1 + 2 + 3 + 4
console.log(array1.reduce(reducer, 5));
// expected output: 15

23. Array.prototype.reduceRight()

The function of the reduceRight() method is the same as that of reduce(). The difference is that reduceRight() accumulates the array items from the end of the array to the front.

const array1 = [[0, 1], [2, 3], [4, 5]].reduceRight(
 (accumulator, currentValue) => accumulator.concat(currentValue)
);
console.log(array1);
// expected output: Array [4, 5, 2, 3, 0, 1]

24. Array.prototype.entries()

Definition and usage:
The entries() method returns an array iterator containing the key / value pairs of the array.

Code example:

var fruits = ["Banana", "Orange", "Apple"];
var iterator = fruits.entries();

Call the next method of the traverser object to traverse:

console.log(iterator.next().value); // [0, "Banana"]
console.log(iterator.next().value); // [1, "Orange"]
console.log(iterator.next().value); // [2, "Apple"]

Use the for...of loop:

for (let [index, elem] of fruits.entries()) {
	console.log(index, elem);
}
// 0 "Banana"
// 1 "Orange"
// 2 "Apple"

25. Array.prototype.keys()

Definition and usage:
The keys() method returns an Array Iterator object containing each index key in the array.
Code example:

var fruits = ["Banana", "Orange", "Apple"];
var iterator = fruits.keys();
for (const key of iterator) {
	console.log(key);
}
// 0 
// 1 
// 2 

26. Array.prototype.values()

Definition and usage:
The values() method returns an Array Iterator object containing each index value in the array.

Code example:

var fruits = ["Banana", "Orange", "Apple"];
var iterator = fruits.values();
for (const value of iterator) {
	console.log(value);
}
// Banana
// Orange
// Apple

27. Array.from()

The Array.from() method creates a new, shallow copy of an array instance from an array like or iteratable object.

console.log(Array.from('foo'));
// ["f", "o", "o"]

console.log(Array.from([1, 2, 3], x => x + x));
// [2, 4, 6]

28. Array.of()

The Array.of() method creates a new array instance with a variable number of arguments, regardless of the number or type of arguments.

The difference between Array.of() and Array constructors is that they handle integer parameters:

• Array.of(7) creates an array with a single element of 7,
• Array(7) creates an empty array with a length of 7 (Note: This refers to an array with 7 empty bits, rather than an array of 7 undefined).

Array.of(7);       // [7] 
Array.of(1, 2, 3); // [1, 2, 3]

Array(7);          // [ , , , , , , ]
Array(1, 2, 3);    // [1, 2, 3]

29. Array.prototype.find()

The find() method returns the value of the first element in the array that satisfies the supplied test function. Otherwise, undefined is returned.

const array1 = [5, 12, 8, 130, 44];
const found = array1.find(element => element > 10);
console.log(found);
// 12

30. Array.prototype.findIndex()

The findIndex() method returns the index of the first element in the array that satisfies the supplied test function. Otherwise, return - 1.

const array1 = [5, 12, 8, 130, 44];
const found = array1.findIndex(element => element > 10);
console.log(found);
// 1

31. Array.prototype.fill()

The fill() method is used to replace the elements of an array with a fixed value.
Syntax:
array.fill(value, start, end)

parameter	describe
value	Necessary. The value of the fill.
start	Optional. Start filling position.
end	Optional. Stop fill position (default is array.length)

Return value: modified array

const array1 = [1, 2, 3, 4];

console.log(array1.fill(0, 2, 4));
// expected output: [1, 2, 0, 0]

console.log(array1.fill(5, 1));
// expected output: [1, 5, 5, 5]

console.log(array1.fill(6));
// expected output: [6, 6, 6, 6]

32. Array.prototype.copyWithin()

The copyWithin() method copies a part of an array to another location in the same array and returns it without changing the length of the original array.
Syntax:
array.copyWithin(target, start, end)

parameter	describe
target	Necessary. Copy to the specified target index location.
start	Optional. The starting location of the element copy.
end	Optional. The index location where replication stops (array. Length by default). If it is a negative value, it means the reciprocal.

Return value: changed array

const array1 = ['a', 'b', 'c', 'd', 'e'];

console.log(array1.copyWithin(0, 3, 4));
// expected output: Array ["d", "b", "c", "d", "e"]

console.log(array1.copyWithin(1, 3));
// expected output: Array ["d", "d", "e", "d", "e"]

33. Array.prototype.includes()

The includes() method is used to determine whether an array contains a specified value. If it does, it returns true, otherwise it returns false

const array1 = [1, 2, 3];

console.log(array1.includes(2));
// expected output: true

const pets = ['cat', 'dog', 'bat'];

console.log(pets.includes('cat'));
// expected output: true

console.log(pets.includes('at'));
// expected output: false

34. Array.prototype.flat()

The flat() method recursively connects all subarrays to the specified depth and returns a new array.

Syntax:
var newArray = arr.flat([depth]);

parameter	describe
depth	Specifies the depth of recursive expansion, default: 1

Code example:

var arr1 = [1, 2, [3, 4]];
console.log(  arr1.flat()) // [1, 2, 3, 4]

var arr2 = [1, 2, [3, 4, [5, 6]]];
arr2.flat();
console.log(arr2.flat()); // [1, 2, 3, 4, [5, 6]]

var arr3 = [1, 2, [3, 4, [5, 6]]];
console.log( arr3.flat(2)); // [1, 2, 3, 4, 5, 6]

The flat() function automatically clears empty elements in an array

var arr4 = [1, 2, , 4, 5];
console.log(arr4.flat()); // [1, 2, 4, 5]

35. Array.prototype.flatMap()

The flat map() method performs a function on each member of the original array, which is equivalent to executing Array.prototype.map(), and then executing the flat() method on the array composed of return values.
This method returns a new array without changing the original array.

Return value:
A new array in which each element is the result of a callback function and the structure depth depth is 1.

Code example:

const arr1 = [1, 2, 3, 4];

const map1 = arr1.map(x => [x * 2]); 
console.log(map1);
// [[2], [4], [6], [8]]

const flatm1 = arr1.flatMap(x => [x * 2]);
console.log(flatm1);
// [2, 4, 6, 8]

const flatm2 = arr1.flatMap(x => [[x * 2]]);
console.log(flatm2);
// [[2], [4], [6], [8]]