js based array API

The method of adding * in the following table will not change the original array.

attribute	describe
*concat()	Join two or more arrays and return the result
*join()	Put all the elements of the array into a string. Elements are separated by the specified separator
pop()	Deletes and returns the last element of the array
push()	Adds one or more elements to the end of the array and returns the new length
shift()	Deletes and returns the first element of the array
unshift()	Adds one or more elements to the beginning of the array and returns the new length
reverse()	Invert the order of elements in an array
sort()	Sort the elements of the array
splice()	Delete the element and add a new element to the array
*toString()	Convert the array to a string and return the result
*slice()	Returns the selected element from an existing array
*find()	Find the value of the first element in the array that meets the requirements
*findIndex	Find the index of the value of the first element in the array that meets the requirements
*flat	Flattened multidimensional array
*flatMap	Flattened multidimensional array
fill	Fill all elements in an array from the start index to the end index with a fixed value

1, concat

var arr = [1, 2, 3]
var arr1 = [4, 5, 6]
var arr3 = [7, 8, 9]
// Concat (arrayx, arrayx,..., arrayx) can connect multiple arrays
var arr2 = arr.concat(arr1, arr3)
console.log(arr2)  // [1, 2, 3, 4, 5, 6, 7, 8, 9]

2, join

var arr = [1, 2, 3]
// join(separator) separator is an optional parameter. If it is not passed, it defaults to ","
var str = arr.join()
var str1 = arr.join("-")
console.log(str) // 1,2,3
console.log(str1) // 1-2-3

3, toString

var arr = [1, 2, 3]
var str = arr.toString()
// The return value is the same as the string returned by the join() method without parameters
console.log(str1)  // 1,2,3

4, slice

var arr = [1, 2, 3]
// slice(start,end) start is mandatory and specifies where to start
// End optional, specifying where to end the selection, excluding the current end element. If this parameter is not specified, the segmented array contains all elements from start to the end of the array
// If start or end is negative, it specifies the position from the end of the array. That is, - 1 refers to the last element, - 2 refers to the penultimate element, and so on
var arr5 = arr.slice(1, 2) // [2]
var arr5 = arr.slice(-3, -1) // [1, 2]
var arr5 = arr.slice(-3) // [1, 2, 3]

5, push

var arr = [1, 2, 3]
var arr1 = [1, 2, 3]
var len = arr.push(4)
var len1 = arr.push(4, 5)
// push returns the new length after adding the specified value to the array
console.log(len) // 4
console.log(len1) // 5
// The original array is changed and the corresponding element is added at the end
console.log(arr) // [1, 2, 3, 4]
console.log(arr1) // [1, 2, 3, 4, 5]

6, pop

var arr = [1, 2, 3]
var number = arr.pop()
// pop returns the last element of the array
console.log(number) // 3
// The original array is changed and an element is deleted at the end
console.log(arr) // [1, 2]

// If the array is already empty, pop() does not change the array and returns an undefined value
var arr1 = []
var num = arr6.pop()
console.log(num) // undefined
console.log(arr1) // []

unshift and shift are the same as push and pop, but they are changed from the head of the array

7, reverse

var arr = [1, 2, 3]
// Invert the order of elements in an array
var newArr = arr.reverse()
console.loig(arr) // [3, 2, 1]
console.loig(newArr) // [3, 2, 1]

8, sort

var arr = [3, 2, 1]
// sort(sortby) sortby is optional and must be a function
var newArr = arr.sort((a, b) => a - b)
console.log(arr) // [1, 2, 3]
console.log(newArr) // [1, 2, 3]

var arr1 = [8, 56, 1, 45, 3, 25]
// sort sorts by default alphabetical order
console.log(arr1.sort()) // [1, 25, 3, 45, 56, 8]

9, splice

var arr = [2, 3, 45, 6, 7, 8]
// Splice (index, howmany, Item1,..., itemx) the number of items to be deleted under the index subscript howmany. If it is set to 0, it will not be deleted
// item1,.....,itemX optional to add a new item to the array
// Intercept from subscript 1, intercept 1
var newArr = arr.splice(1, 1)
console.log(newArr) // [3]
console.log(arr) // [2, 45, 6, 7, 8]

var arr1 = [2, 3, 45, 6, 7, 8]
// Intercept from subscript 1, intercept 1, and then add 1 at the current position
var newArr1 = arr.splice(1, 1, 1)
console.log(newArr1) // [3]
console.log(arr1) // [2, 1, 45, 6, 7, 8]

var arr2 = [2, 3, 45, 6, 7, 8]
// Intercept from subscript 1, intercept 0, and then add 1, 3, 4 and 5 to the current position
var newArr2 = arr.splice(1, 0, 1, 3, 4, 5)
console.log(newArr2) // []
console.log(arr2) // [2, 1, 3, 4, 5, 3, 45, 6, 7, 8]

10, indexOf

Returns the position of a specified element in an array

var fruits = ["Banana", "Orange", "Apple", "Mango"]
// Indexof (item, start) item is required and start is optional. It specifies the position to start retrieval in the array
// If the array does not contain this element, - 1 is returned
var result = fruits.indexOf("Apple")
console.log(result) // 2

var fruits1 = ["Banana","Orange","Apple","Mango","Banana","Orange","Apple"]
// Indicates to start searching from the element with subscript 4
var result1 = fruits.indexOf("Apple",4)
console.log(result1) // 6

lastIndexOf() is similar to indexOf, except that lastIndexOf returns the last position of the element in the array

11, includes

Determines whether an array contains a specified value

let site = ['runoob', 'google', 'taobao']
// includes(searchElement, fromIndex) fromIndex is optional. It specifies the position to start retrieval in the array
site.includes('runoob')  // true 
site.includes('baidu')  // false

12, forEach

Each element of the array executes a callback function without a return value

var arr = [2, 3, 45, 6, 7, 8]
arr.forEach((item,index) => {
	console.log(item, index)
})

13, map

Process each element of the array through the specified function and return the processed array. The original array will not be changed

var arr = [1, 2, 3]
var arr2 = arr.map(item => item * 2)
console.log(arr2) // [2, 4, 6]

14, filter

Detects numeric elements and returns an array of all elements that meet the criteria

var arr = [3, 5, 42, 1, 33, 1, 43, 5]
var arr2 = arr.filter(item => item < 10)	
console.log(arr2) // [3, 5, 1, 1, 5]

15, some

Detect whether any element in the array element meets the specified conditions, and the return value is Boolean

var arr = [3, 5, 42, 1, 33, 1, 43, 5]
// Return true as long as there is one that meets the condition
var arr2 = arr.some(item => item < 10)	
console.log(arr2) // true

16, every

Check whether each element of a numeric element meets the conditions, and the return value is a Boolean value

var arr = [3, 5, 42, 1, 33, 1, 43, 5]
// Only when each item meets the conditions can it return true
var arr2 = arr.some(item => item < 10)	
console.log(arr2) // false

17, reduce

Evaluate array elements to a value (left to right)

var arr = [3, 5, 42, 1, 33, 1, 43, 5]
console.log(arr)
//The result returned from the previous iteration is used as the prev of the next iteration
var sum = arr.reduce((prev, next) => {
    return prev + next
}, 0)
console.log(sum) // 133

The function of reducereight() is the same as that of reduce, except that it accumulates from right to left

// Two bit arrays are merged into one-dimensional arrays
var arr = [
    [1, 2, 3],
    [4, 5, 6],
    [7, 8, 9]
]
var arr1 = arr.reduce((prev, next) => {
    return prev.concat(next)
}, [])
console.log(arr1) // [1, 2, 3, 4, 5, 6, 7, 8, 9]

18, find

Find the value of the first element in the array that meets the requirements

var arr = [3, 5, 42, 1, 33, 1, 43, 5]
const val = arr.find(item => item > 3)
console.log(val) // 5

19, flat

Flattened multidimensional array

let arr = [
    [1,2],
    [3,4],
    [
        [6,7],
        [
            [8],
            [9,10]
        ]
    ]
]
// arr.flat(depth) depth specifies the structure depth of the nested array to be extracted. The default value is 1
console.log(arr.flat(1)) // [1, 2, 3, 4, [[6,7],[[8],[9,10]]]]
console.log(arr.flat(Infinity)) // [1, 2, 3, 4, 6, 7, 8, 9, 10]

20, flatMap

First, use the mapping function to map each element, and then compress the result into a new array

let arr = [
    [1, 2],
    [3, 4],
    [6, 8]
]
let arr2 = arr.flatMap(item => {
    return item.filter(item => item >= 2)
})
console.log(arr2) // [2, 3, 4, 6, 8]

21, fill

Fill all elements in an array from the start index to the end index with a fixed value

// Arr.fill (value [, start [, end]]) value is the value used to fill in, start the index and end the index
let arr = ["a", "b", "c", "d", "e"]
arr.fill("f", 1, 3)
console.log(arr) // ['a', 'f', 'f', 'd', 'e']
// Note that fill does not change the length of the original array
arr.fill("f", 1, 30)
console.log(arr) // ['a', 'f', 'f', 'f', 'f']

attribute	describe	Return value
from	Convert an array of classes into an array	New array generated from class values
isArray	Check whether the data is an array	Boolean
of	Convert parameters to an array	New array

1, Array from()

Convert a class array into a real array (class value: subscript and length)

let list = document.querySlectorAll('#list li ') / / get a list of li
list = Array.from(list)

// You can also use the extension operator to convert an array of classes to an array
list = [...list]