"Si un trabajador quiere hacer bien su trabajo, primero debe afilar sus herramientas." - Confucio, "Las Analectas de Confucio. Lu Linggong"
Página delantera > Programación > Matrices de JavaScript

Matrices de JavaScript

Publicado el 2024-08-28
Navegar:433

JavaScript Arrays

¿Qué son los arreglos?

Las matrices son una estructura de datos que almacena una colección ordenada de elementos. En JavaScript, las matrices se clasifican como un tipo especial de objeto y pueden almacenar números, cadenas, objetos u otras matrices. Los elementos de una matriz están entre corchetes [] y utilizan un índice de base cero. Un índice de base cero significa que el primer elemento de una matriz tendrá un índice de 0, el segundo elemento tendrá un índice de 1, y así sucesivamente.

const names = ["David", "Hannah", "William"];
console.log(names[0]); // returns the first element
// returns "David"
console.log(names[1]); // returns the second element
// returns "Hannah"
console.log(names[2]); // returns the third element
// returns "William"

¿Cómo se pueden modificar o manipular los arrays?

Índice del elemento en una matriz

Se puede agregar un nuevo elemento a una matriz asignando un valor a un índice vacío.

names[3] = "Eric";
console.log(names);
// returns ["David", "Hannah", "William", "Eric"]

Los elementos de una matriz se pueden modificar reasignando un nuevo valor a un índice existente.

names[1] = "Juniper";
console.log(names);
// returns ["David", "Juniper", "William", "Eric"]

Métodos de matriz

Las matrices también se pueden modificar o manipular con métodos de matriz como 'push', 'pop', 'unshift', 'shift', 'slice' y 'splice'.

'empujar()'

El método 'push' toma uno o más elementos como argumentos, agrega los elementos al final de la matriz y devuelve la longitud de la matriz modificada.

names.push("Bob");
// returns 5 
console.log(names);
// returns ["David", "Juniper", "William", "Eric", "Bob"]

'estallido()'

El método 'pop' no toma argumentos, elimina el último elemento de la matriz y devuelve el elemento eliminado.

names.pop();
// returns "Bob"
console.log(names);
// returns ["David", "Juniper", "William", "Eric"]

'desplazar()'

El método 'unshift' toma uno o más elementos como argumentos, agrega los elementos al comienzo de la matriz y devuelve la longitud de la matriz modificada.

names.unshift("Jack", "Jane");
// returns 6
console.log(names);
// returns ["Jack", "Jane", "David", "Juniper", "William", "Eric"]

'cambio()'

El método 'shift' no toma argumentos, elimina el primer elemento de una matriz y devuelve el elemento eliminado.

names.shift();
// returns "Jack"
console.log(names);
// returns ["Jane", "David", "Juniper", "William", "Eric"]

'rebanada()'

El método 'slice' toma dos argumentos opcionales (startIndex, endIndex) y devuelve una nueva matriz con los elementos desde startIndex hasta el endIndex de la matriz original, pero sin incluirlo.
Si se omite startIndex, se utiliza 0.
Si se omite endIndex, se utiliza la longitud de la matriz. Se pueden utilizar números de índice negativos para contar hacia atrás desde el final de la matriz.

names.slice(1, 3);
// returns ["David", "Juniper"]
names.slice(3);
// returns ["Juniper", "William", "Eric"]
names.slice(-2, 1);
// returns ["William", "Eric", "Jane"]
names.slice();
// returns ["Jane", "David", "Juniper", "William", "Eric"]

'empalme()'

El método 'splice' toma uno o más argumentos (startIndex, deleteCount, elemento1, elemento2, ...) y devuelve una nueva matriz que contiene todos los elementos eliminados. Desde startIndex, el número de elementos de deleteCount se elimina y los siguientes argumentos de elementos se agregarán a la matriz a partir de startIndex. Si se omite eliminarCount, se eliminan todos los elementos desde startIndex hasta el final de la matriz. Si se omiten los argumentos de los elementos, no se agrega ningún elemento.

names.splice(0, 1, "Joe", "Alex"); 
// returns ["Jane"]
console.log(names);
// returns ["Joe", "Alex", "David", "Juniper", "William", "Eric"]
names.splice(1, 4);
// returns ["Alex", "David", "Juniper", "William"]
console.log(names);
// returns ["Joe", "Eric"]
names.splice(0, 0, "Bob", "Frank", "Maria")
// returns []
console.log(names);
// returns ["Joe", "Bob", "Frank", "Maria", "Eric"]

Dado que 'push', 'pop', 'unshift', 'shift y 'splice' modifican la matriz original, se clasifican como métodos destructivos. El método 'slice' deja intacta la matriz original, por lo que se clasifica como no destructiva.

Operador de extensión '...'

Para agregar elementos o copiar una matriz de forma no destructiva, se puede utilizar el operador de extensión. El operador de extensión distribuye una matriz en sus elementos.

const array = [1, 2, 3];
const newArray = [0, ...array, 4, 5];
// ...array spreads [1, 2, 3] into 1, 2, 3
console.log(newArray);
// returns [1, 2, 3, 4, 5]

Sin el operador de extensión, la matriz original estaría anidada dentro de la nueva matriz.

const array = [1, 2, 3];
const newArray = [0, array, 4, 5];
console.log(newArray);
// returns [0, [1, 2, 3], 4, 5];

Métodos de matriz iterativos

Los métodos de matriz iterativos llaman a una función proporcionada en cada elemento de una matriz y devuelven un valor o una nueva matriz. La función proporcionada se llama con tres argumentos: el elemento actual, el índice del elemento actual y la matriz original en la que se llamó al método.

function callbackFunction (currentElement, currentIndex, originalArray) {
// function body
}

Algunos ejemplos de métodos de matriz iterativos son: 'buscar', 'filtrar', 'mapear' y 'reducir'.

'encontrar()'

El método 'find' toma una función como argumento y devuelve el primer elemento de la matriz que satisface las condiciones de la función.

const numbers = [5, 10, 15, 20, 25];
numbers.find(number => number > 15);
// returns 20;

'filtrar()'

El método 'filtro' es similar al método 'buscar', pero en cambio devuelve una matriz de todos los elementos que satisfacen las condiciones de la función dada.

const numbers = [5, 10, 15, 20, 25];
numbers.filter(number => number > 15);
// returns [20, 25];

'mapa()'

El método 'map' devuelve una nueva matriz con los resultados de llamar a la función en cada elemento de la matriz original.

const numbers = [1, 2, 3, 4, 5];
numbers.map(number => number * number);
// returns [1, 4, 9, 16, 25]

'reducir()'

El método 'reducir' toma una función y un valor inicial como argumento. La función proporcionada recibe cuatro argumentos: el acumulador, el valor actual, el índice actual y la matriz original. El valor inicial proporcionado es el valor del acumulador para el primer elemento de la matriz. El resultado de la función para cada elemento se utiliza como valor del acumulador para el siguiente elemento de la matriz. Si no se proporciona un valor inicial, el acumulador se establece en el primer elemento de la matriz y la función de devolución de llamada se llama a partir del segundo elemento.

const numbers = [1, 2, 3, 4, 5]
numbers.reduce(((acc, number) => acc   number), 0);
// returns 15
Declaración de liberación Este artículo se reproduce en: https://dev.to/jae_jeong_56b53bffb105974/javascript-arrays-3hhp?1 Si hay alguna infracción, comuníquese con [email protected] para eliminarla.
Último tutorial Más>

Descargo de responsabilidad: Todos los recursos proporcionados provienen en parte de Internet. Si existe alguna infracción de sus derechos de autor u otros derechos e intereses, explique los motivos detallados y proporcione pruebas de los derechos de autor o derechos e intereses y luego envíelos al correo electrónico: [email protected]. Lo manejaremos por usted lo antes posible.

Copyright© 2022 湘ICP备2022001581号-3