Resumen de JavaScript de 18 métodos de matriz de uso común

Como todos sabemos, solicitar datos desde el backend y procesarlos son habilidades esenciales para los ingenieros de front-end. Los datos solicitados desde el backend a menudo se devuelven al frontend en forma de una matriz, por lo que la importancia de los métodos de procesamiento de matrices puede ser. imaginado; métodos de procesamiento de matrices Hay muchos documentos MDN. Muchos amigos a menudo no comprenden los puntos clave cuando aprenden, lo que da como resultado la mitad del resultado, pero no se preocupe, he resumido 18 métodos de procesamiento de matrices de uso común. en el trabajo.

forEach()

no cambiará la matriz original

es una función. El primer parámetro formal de la función pasada internamente es el valor de cada elemento en la matriz de elementos. el segundo es el índice del número de índice. Su valor de retorno no está definido;
El ejemplo en ejecución es el siguiente:

Salida de consola

Método filter()

El método filter() es un método para filtrar matrices. Los parámetros pasados ​​son los mismos que los del método forEach, pero el valor de retorno es una matriz. La aplicación real es filtrar las matrices que cumplen las condiciones. los datos adquiridos;
El ejemplo en ejecución es el siguiente:

La salida de la consola es la siguiente:

Método map()

Los parámetros pasados ​​por el método map() también son los mismos que los anteriores, y su valor de retorno también es una nueva matriz. El método map() puede realizar el mismo procesamiento en cada elemento de la matriz. el ejemplo es el siguiente:

Salida de consola:

Método findIndex()

El método findIndex(), como su nombre indica, devuelve el número de índice del primer elemento de la matriz que cumple las condiciones. Si no se puede encontrar, devuelve -1. Los parámetros pasados ​​son los mismos que los anteriores y el ejemplo en ejecución es el siguiente:

let arr = [1, 3, 3, 4, 5, 6, 7]
// método findIndex, devuelve el número de índice del primer elemento que cumple las condiciones; si no se encuentra, devuelve -1
const res = arr.findIndex((elemento) => elemento > 5)

console.log(res)

:

Método find() El

método find() devuelve el primer elemento encontrado que cumple las condiciones. Los parámetros pasados ​​son los mismos que los anteriores. El ejemplo en ejecución es el siguiente:

let arr = [1, 3, 3, 4, 5, 6, 7]
//find() busca un elemento y devuelve el primer elemento que cumple las condiciones. Si lo encuentra, devuelve un valor indefinido.
const res2 = arr.find((elemento) => {
  devolver artículo > 5
})

console.log(res2)

son los siguientes:

método some()

Los parámetros pasados ​​por el método some() son los mismos que los anteriores y el valor de retorno es un valor booleano. Siempre que se encuentre un elemento que cumpla las condiciones, devolverá verdadero. :

sea arr = [1, 3, 3, 4, 5, 6, 7]
//algún método devuelve un valor booleano const bl = arr.some((item) => {
  devolver artículo > 5
})
consola.log(bl)

método each()

Los parámetros pasados ​​por el método each() son los mismos que los anteriores y el valor de retorno es un valor booleano, pero cada elemento debe cumplir las condiciones para devolver verdadero. El ejemplo es el siguiente:

let arr = [1; , 3, 3, 4, 5, 6, 7]
//cada() devuelve un valor booleano que debe pasar las condiciones de filtrado antes de devolver verdadero
const bl2 = arr.cada((valoractual) => {
  devolver valor actual <10
})
consola.log(bl2)

Función de inducción reducir ()

El primer parámetro en la función reducir () es la función, el segundo parámetro es el tipo de suma de la variable temporal, la función del primer parámetro tiene cuatro parámetros, pero el primer parámetro comúnmente usado es Acumular variables temporales (regresar es este valor), el segundo elemento del parámetro. El tercero es el índice y el cuarto es la matriz misma. El ejemplo de código es el siguiente:

let arr = [1, 3, 3, 4, 5, 6, 7];
//reduce() función de inducción const valor anterior = 0
const arrSum = arr.reduce((valoranterior, valoractual) => {
  devolver valor anterior + valor actual
}, 0)
Los resultados de salida de la consola console.log(arrSum)

son los siguientes:

concat() Empalme de matrices

concat() empalma dos matrices y devuelve la nueva matriz empalmada. Las matrices multidimensionales (matrices dentro de matrices) no se pueden unir;
El ejemplo de código es el siguiente:

let arr = [1, 3, 3, 4, 5, 6, 7]
 //concat concatena dos matrices y devuelve una nueva matriz
 constante nuevaArr3 = [2, 5, 5, 6, 6, 8]
 const concatArr = arr.concat(nuevoArr3)
 consola.log(concatArr)

Los métodos para cambiar la matriz original

push()/unshift()

El método push()/unshift() es agregar un elemento al final y al frente de la matriz respectivamente, y el valor de retorno es la longitud de la nueva matriz

//

El método de procesamiento de la matriz cambiará. Const matriz original Arr = [1, 3, 5, 6, 7, 8, 9]
Arr.push(1)
consola.log(Arr)
consola.log(Arr)
const a = Arr.unshift(1)

console.log(a)

son los siguientes:

pop()/shift()

último

valor de la matriz y shift() elimina el valor del primer elemento de la matriz; el valor de retorno es el elemento eliminado;

consola.log(arr)
cambio de dirección(1)
Los resultados de salida de la consola console.log(arr)

son los siguientes:

sort()/reverse()

El método sort() es ordenar. El parámetro interno es una función, function(a, b){ return a - b }. la función está en orden ascendente. Si el parámetro interno return a - b es en orden descendente, return a + b es en orden ascendente;
Reverse() es un cambio de matriz, es decir, organizar los elementos de la matriz en orden inverso. El ejemplo de código es el siguiente:

let arr = [1, 3, 3, 4, 5, 6, 7]arr.sort( (a, b) => {
  devolver a - b})console.log(arr)arr.reverse()console.log(arr)

splice()

El método splice() modifica la matriz original y devuelve una nueva matriz con elementos eliminados. El número negativo es el número de índice de atrás hacia adelante; el primer parámetro pasado es el número de índice del elemento inicial eliminado; el segundo parámetro es el número de elementos eliminados;

let arr = [1, 3, 3, 4, 5, 6, 7]arr.splice(1, 3)console.log(arr)

Otro

flat()

flat() se usa para aplanar matrices multidimensionales. El parámetro pasado es la profundidad de la matriz, que también puede ser infinita, lo que significa que la profundidad de la matriz es infinita. :

constante Arr2 = [
  [1, 2],
  [veintitrés],
  [4, 5],
  [5, 6],]console.log(Arr2.flat(Infinity))

resultados de salida de la consola:

fill()

puede llenar una matriz: Método de escritura: Array.fill(1, 2, 4) llena la matriz con 1, comenzando desde el elemento con valor de índice 2, comenzando con el número de índice del elemento comenzando desde 4, excluyendo el el valor del índice es 4 elementos; el elemento relleno sobrescribirá el elemento original correspondiente al número de índice;
El ejemplo de código es el siguiente:

const Arr2 = [
  [1, 2],
  [veintitrés],
  [4, 5],
  [5, 6],]console.log(Arr2.fill(1, 0, 4))

resultados de salida de la consola: