Funciones de array en JavaScript

funciones de array

8 útiles funciones de array en JavaScript (con snippets de código)

Funciones de array — Realmente debería saber esto a estas alturas.


JavaScript ha tenido arrays desde sus inicios. Es un tipo de objeto muy útil que nos permite crear una lista de elementos con cualquier tipo que queramos. Los subarreglos, una lista de la compra o los datos de una tabla pueden ser todos de arreglos.

No entraré en ningún array en detalle aquí, y asumiré que sabe cómo funcionan. Sin embargo, hay bastantes funciones integradas en el tipo de array que pueden ser muy útiles cuando se trabaja con matrices en diferentes escenarios.


Some y Every

A veces, desea verificar si los elementos dentro de una matriz se ajustan a alguna prueba preestablecida. Esta prueba debe tener la forma de una función. Esta puede ser una función de flecha si lo desea. Debe incluir un argumento para la prueba. La función some busca al menos un único elemento que pasa la prueba, mientras que every solo devuelve true si todos los valores pasan la prueba.

let arr [4, 5, 7, 8]
let some = arr.some((x) => x > 6);
// -> True

let every = arr.every((x) => x > 5);
// -> false

Concat

La concatenación se puede hacer con cadenas con el operador +, sin embargo, esto no se puede hacer con matrices. Podemos usar el operador de propagación, o podemos usar la función concat. Podemos dar en un argumento la matriz que queremos agregar a la matriz desde la que llamamos a la función.

const arr1 = ['a', 'b', 'c'];
const arr2 = ['d', 'e', 'f'];
const arr3 = arr1.concat(arr2);
// -> ["a", "b", "c", "d", "e", "f"]

Length

Una de las funciones más importantes (en realidad solo un valor) es el valor de length. Devuelve el número de elementos dentro de una matriz. Si la matriz tiene valores del índice 0 al 4, devolverá 5 ya que tiene cinco elementos. Esto es muy útil al crear bucles for tradicionales.

let arr = ['orange', 'apple', 'pear', 'dragonfruit'];
let num = arr.length;
// -> 4

Includes

Otra tarea muy importante que se debe realizar en las matrices es verificar si se incluye un valor específico en la matriz. Es posible que desee ver si un usuario es vegetariano o si una lista de recetas tiene un determinado ingrediente. La función devolverá un valor booleano dependiendo de si el valor se ha encontrado en la matriz.

let fruits = ['apple', 'banana', 'lemon', 'lime'];
let hasCheeseburger = fruits.includes("cheeseburger");
// -> false

Find y FindIndex

Las findfindIndex son muy similares. pasamos una prueba a la función, como con some. La función devolverá el primer valor que pase la prueba y, en el caso de findIndex, devolverá el índice en el que se encontró el primer elemento que pasó la prueba.

let arr = [1, 2, 3, 4, 5]
let found = arr.find((x) => x > 3)
// -> 4

let foundIndex = arr.findIndex((x) => x > 3)
// -> 3

Map

La función de map es una función muy conocida que simplemente aplica una función determinada en cada elemento dentro de la matriz. Devolverá una nueva matriz. Esto es muy útil para crear una lista de elementos de React.

const arr = [1, 4, 9, 16];

// pass a function to map that multiplies every item
const arr2 = arr.map((item) => {
  return item * 2
});

console.log(arr2);
// expected output: Array [2, 8, 18, 32]

Filtrar

El filtrado de matrices es otra funcionalidad esencial que tiene muchos casos de uso. Tienes que proporcionarle una función. Si un elemento pasa esa prueba, se incluye en la nueva matriz; de lo contrario, no se incluye en la nueva matriz.

function isOldEnough(value) {
  return value >= 18;
}

var filtered = [12, 5, 8, 34, 44].filter(isOldEnough);
// -> [34, 44]

ForEach

En lugar de usar el bucle for real, también puede usar la función forEach que está integrada en las matrices. Ejecutará una función para cada elemento de la matriz. Básicamente, acorta la sintaxis for(i=0;i<arr.length;i++) en arr.forEach(). Es una forma muy elegante de recorrer una matriz. Puede ingresar tanto el elemento como los parámetros de índice en la función.

let arr = [1, 2, 3, 4]
arr.forEach((item) => {
  console.log(item) 
})

Conclusión

Trabajar con array puede ser divertido. También puede ser horrible. Pero solo si no sabe cómo trabajar con ellos. Afortunadamente, son muy fáciles de dominar y, con estas funciones, no tendrá nada de qué preocuparse al manejar matrices en su código.

¡Muchas gracias por leer y que tenga un día maravilloso!

Recent Post