Create an array

Literal mode

const arr = [1.3.5]
Copy the code

Object constructor

const arr1 = new Array(a)/ / []
// The number of elements with only one argument
const arr2 = new Array(3)		// [,,]
const arr3 = new Array(1.3.5)	/ / [1, 3, 5]
// Not using new has no effect
const arr4 = Array(1.3.5)		/ / [1, 3, 5]
Copy the code

ES6 new

// Solve a problem with object constructors because of the number of arguments
const arr1 = Array.of(3)		/ / [3]
const arr2 = Array.of(1.3.5)	/ / [1, 3, 5]

// Convert an array-like object into a real array
const arr3 = Array.from('135'); / / [' 1 ', '3', '5')
const arr4 = Array.from(new Set([1.3.5])) / / [1, 3, 5]
Copy the code

Commonly used method

Pure functions

join()

Separator (Optional) : Specifies the separator to use. It can be a string. The default is a comma
array.join(separator)
Copy the code

Concatenates all elements in an array with the specified delimiter, returning a string

const arr =  ['a'.'b'.'c'.'d']

console.log(arr.join(123))	// a123b123c123d
console.log(arr.join(The '-'))	// a-b-c-d
Copy the code

slice()

Select some elements and shallow copy them into a new array

// start(must) : start subscript, negative to start from the end
// end(optional) : ends the subscript
array.slice(start, end)
Copy the code
const arr =  ['a'.'b'.'c'.'d']

console.log(arr.slice(1))		// ['b', 'c', 'd']
console.log(arr.slice(-2))		// ['c', 'd']
console.log(arr.slice(1.2)) 	// ['b']
console.log(arr)			   // ['a', 'b', 'c', 'd']
Copy the code
// Shallow copy chestnuts
const arr =  [
  {id: 1.name: 'wly'},
  {id: 2.name: 'tom'}]const newArr = arr.slice(1)
console.log(newArr[0]===arr[1])	// true
Copy the code

cancat()

Merges two or more arrays to return a new array

array.cancat(arr1, arr2, ...)
Copy the code
const arr1 =  ['a'.'b']
const arr2 = [1.2.3]
const arr3 = ['hello'.'world']

console.log(arr1.concat(arr2, arr3)) // ['a', 'b', 1, 2, 3, 'hello', 'world']
console.log(arr1)	// ['a', 'b']
Copy the code

indexOf()

Looks for an element in the array, returns the element’s subscript, or -1 if not

// searchValue(must) : the value to be searched
// fromIndex(optional) : Where to start the search
array.indexOf(searchValue, fromIndex)
Copy the code
const arr =  ['a'.'b'.'c']
console.log(arr.indexOf('b'))	/ / 1
console.log(arr.indexOf('d'))	// -1
Copy the code

lastIndexOf()

Finds an element in the array backwards, returns the element’s subscript, or -1 if not

// searchValue(must) : the value to be searched
// fromIndex(optional) : Where to start the search
array.indexOf(searchValue, fromIndex)
Copy the code
const arr = ['a'.'b'.'c'.'b'.'e']

console.log(arr.lastIndexOf('b'))	/ / 3
console.log(arr.lastIndexOf('d'))	// -1
Copy the code

includes()

Finds if the array contains an element, returning a Boolean

// searchValue(must) : the value to be searched
// fromIndex(optional) : Where to start the search
array.includes(searchValue, fromIndex)
Copy the code
const arr = ['a'.'b'.'c']

console.log(arr.includes('b'))	// true
console.log(arr.includes('d'))	// false
Copy the code

The pure functions

sort()

Sort the elements of an array and return the sorted array

// Function (optional) : custom collation rules
array.sort(function(a, b))
Copy the code
  • If the comparison function returns a value <0, then A comes before B
  • If the comparison function returns 0, the relative positions of a and b remain the same
  • If the comparison function returns a value greater than 0, b comes before A
const arr1 = [2.1.3.1]
const arr2 = ['b'.'a'.'c'.'a']

console.log(arr1.sort()) // [1, 1, 2, 3]
console.log(arr2.sort()) // ['a', 'a', 'b', 'c']
Copy the code
// Select * from score where age is the same as age
const arr = [
  {age: 25.score: 5},
  {age: 10.score: 20},
  {age: 30.score: 10},
  {age: 5.score: 90},
  {age: 10.score: 40},
]

arr.sort((a, b) = >{
  if(a.age === b.age) {
    return b.score - a.score
  }else {
    return b.age - a.age
  }
})

console.log(arr)
Copy the code

splice()

Add, delete, or modify elements in an array

// index(required) : an integer indicating the position of processing, if negative, starting at the end of the array
// HowMANY (Optional) : indicates the number of files to be deleted. The value is 0
// item(optional) : new element added
array.splice(index, howmany, item1, item2 ...)
Copy the code
/ / add
const arr = [1.2.3.4.5]

console.log(arr.splice(2.0.'a'.'b'))	/ / []
console.log(arr)	// [1, 2, 'a', 'b', 3, 4, 5]
Copy the code
/ / delete
const arr = [1.2.3.4.5]

console.log(arr.splice(0.3))	/ / [1, 2, 3]
console.log(arr)	/ / [4, 5]
Copy the code
/ / modify
const arr = [1.2.3.4.5]

console.log(arr.splice(2.1.'a'))	/ / [3]
console.log(arr)	// [1, 2, 'a', 4, 5]
// arr[2]='a'
Copy the code

pop()

Removes the last element in the array and returns that element

const arr = ['a'.'b'.'c']

console.log(arr.pop())	// c
console.log(arr)	// ['a', 'b']
Copy the code

shift()

Removes the first element in an array and returns that element

push()

Returns the length of the new array by adding an element to the end of the array

array.push(item1, item2, ...)
Copy the code
const arr = ['a'.'b'.'c']

console.log(arr.push('d'.'e')) / / 5
console.log(arr)	// ['a', 'b', 'c', 'd', 'e']
Copy the code

unshift()

Returns the length of the new array by adding an element to the beginning of the array

array.unshift(item1, item2, ...)
Copy the code
const arr = ['a'.'b'.'c']

console.log(arr.unshift('d'.'e')) / / 5
console.log(arr)	// ['d', 'e', 'a', 'b', 'c']
Copy the code

unshift()

Reverses the order of the elements in an array

const arr = ['a'.'b'.'c']

console.log(arr.reverse())	// ['c', 'b', 'a']
console.log(arr)	// ['c', 'b', 'a']
Copy the code

Through the array

None of the following functions will change the original array

foreach()

Execute one callback for each element in the array

// currentValue(mandatory) : the current element value
// index(Optional) : indicates the index of the current element
// arR (optional) : array object itself
// thisValue(optional) : object used for this callback, passed to function, used as this value
array.forEach(function(currentValue, index, arr), thisValue)
Copy the code
const arr = [1.2.3.4.5]

arr.forEach((item, index) = >{
  console.log(item, index)
})
Copy the code

Note:

Foreach () cannot exit the loop (not recommended even if it can)

If you must exit the loop, do not use it

every()

Checks whether all elements in the array satisfy the conditions defined by the callback function, returning true if they do, and false otherwise

array.every(function(currentValue, index, arr), thisValue)
Copy the code

some()

Checks if all elements in the array meet one of the conditions defined by the callback function. Returns true if they do, and false otherwise

array.some(function(currentValue, index, arr), thisValue)
Copy the code

find()

Finds the first element that satisfies the callback function and returns that element, or returns undefined

array.find(function(currentValue, index, arr), thisArg)
Copy the code

findIndex()

Finds the first element that satisfies the callback function and returns its subscript, or -1 if not

array.findIndex(function(currentValue, index, arr), thisArg)
Copy the code

filter()

Returns a new array filtered through the callback function

array.filter(function(currentValue,index,arr), thisValue)
Copy the code
const arr = [1.2.5.6]

let newVal = arr.filter((i) = > i > 3)

console.log(arr) // [1, 2, 5, 6]
console.log(newVal) / / [5, 6]
Copy the code

map()

Each element in the array is processed by the callback function, and the elements returned by the callback function are returned as a new array

array.map(function(currentValue,index,arr), thisValue)
Copy the code
const arr = [1.2.5.6]

let newVal = arr.map((i) = > i * i)

console.log(arr) // [1, 2, 5, 6]
console.log(newVal) // [1, 4, 25, 36]
Copy the code

reduce()

It receives a function as an accumulator, processing the value returned by the last function as an argument to the next function, and finally returning a value

// total(must) : the initial value or the value returned after the last function call
// currentValue(mandatory) : the current element value
// index(Optional) : indicates the index of the current element
// arR (optional) : array object itself
// initialValue(Optional) : Specifies the first argument to the first callback function
array.reduce(function(total, currentValue, index, arr), initialValue)
Copy the code
let arr = [1.2.5.6]

let newVal = arr.reduce((total, item) = > {
    console.log(total, item)	    /* 1, 2, 3, 5, 8, 6 */
    return total + item
})

console.log(arr)	// [1, 2, 5, 6]
console.log(newVal)	/ / 14
Copy the code

Chain calls

const arr = [1.2.5.6]

let newVal = arr
                .map(i= >i*3)
                .filter(i= >i>5)
                .reduce((total, i) = > total+i)
console.log(newVal) / / 39
Copy the code

reference

Array detailed operation methods and parsing collection