CodeGym/Cursos/Frontend SELF ES/Métodos básicos de arrays

Métodos básicos de arrays

Disponible

7.1 Método splice()

Los arrays en JavaScript proporcionan métodos integrados para manipular datos. En esta lección veremos cuatro métodos básicos de arrays: splice(), slice(), concat() y indexOf(). Cada uno de estos métodos realiza ciertas operaciones sobre arrays y puede simplificar significativamente el procesamiento de datos.

El método splice() modifica el contenido de un array, eliminando elementos existentes y/o agregando nuevos elementos en su lugar.

Sintaxis:

splice
(start, deleteCount, item1, item2, ...);

Dónde:

  • start: índice desde el cual comenzar los cambios
  • deleteCount: cantidad de elementos a eliminar. Si no se especifica, se eliminan todos los elementos desde la posición start
  • item1, item2, ...: elementos que se añaden al array. Si no se especifica, no se añaden elementos

Ejemplo 1: Eliminación de elementos

En este ejemplo, se eliminan dos elementos del array fruits, a partir del índice 2. El valor de retorno es el array de elementos eliminados.

JavaScript
let fruits = ['apple', 'banana', 'cherry', 'date', 'fig'];
let removed = fruits.splice(2, 2);

console.log(fruits);   // Mostrará: ['apple', 'banana', 'fig']
console.log(removed);  // Mostrará: ['cherry', 'date']

Ejemplo 2: Adición de elementos

En este ejemplo, se añaden dos nuevos elementos (date y fig) al array fruits empezando desde el índice 2. No se realiza eliminación de elementos.

JavaScript
let fruits = ['apple', 'banana', 'cherry'];
fruits.splice(2, 0, 'date', 'fig');

console.log(fruits);   // Mostrará: ['apple', 'banana', 'date', 'fig', 'cherry']

Ejemplo 3: Sustitución de elementos

En este ejemplo, el elemento con el índice 1 (banana) se sustituye por dos nuevos elementos (date y fig).

JavaScript
let fruits = ['apple', 'banana', 'cherry'];
fruits.splice(1, 1, 'date', 'fig');

console.log(fruits);   // Mostrará: ['apple', 'date', 'fig', 'cherry']

7.2 Método slice()

El método slice() devuelve un nuevo array que contiene una copia de una parte del array original. El array original no se modifica.

Sintaxis:

array.slice(begin, end);

Dónde:

  • begin: índice desde el cual empezar la copia
  • end: índice hasta el cual copiar (sin incluir el elemento en este índice). Si no se especifica, se copian todos los elementos hasta el final del array

Ejemplo 1: Copia de una parte del array

En este ejemplo, se crea un nuevo array que contiene elementos con índices desde 1 hasta 2 del array fruits.

JavaScript
let fruits = ['apple', 'banana', 'cherry', 'date', 'fig'];
let sliced = fruits.slice(1, 3);

console.log(sliced);   // Mostrará: ['banana', 'cherry']

Ejemplo 2: Copia desde el inicio del array

En este ejemplo, se crea un nuevo array que contiene elementos con índices 0 y 1 del array fruits.

JavaScript
let fruits = ['apple', 'banana', 'cherry'];
let sliced = fruits.slice(0, 2);

console.log(sliced);   // Mostrará: ['apple', 'banana']

Ejemplo 3: Copia hasta el final del array

En este ejemplo, se crea un nuevo array que contiene elementos desde el índice 1 hasta el final del array fruits.

JavaScript
let fruits = ['apple', 'banana', 'cherry'];
let sliced = fruits.slice(1);

console.log(sliced);   // Mostrará: ['banana', 'cherry']

7.3 Método concat()

El método concat() se utiliza para unir dos o más arrays. Devuelve un nuevo array que contiene elementos de todos los arrays unidos.

Sintaxis:

array1.concat(array2, array3, ...);

Dónde:

  • array1, array2, array3, ...: arrays que se deben unir

Ejemplo 1: Unión de dos arrays

En este ejemplo, los arrays fruits1 y fruits2 se unen en un nuevo array combined.

JavaScript
let fruits1 = ['apple', 'banana'];
let fruits2 = ['cherry', 'date'];
let combined = fruits1.concat(fruits2);

console.log(combined); // Mostrará: ['apple', 'banana', 'cherry', 'date']

Ejemplo 2: Unión de múltiples arrays

En este ejemplo, tres arrays se unen en un nuevo array combined.

JavaScript
let fruits1 = ['apple', 'banana'];
let fruits2 = ['cherry', 'date'];
let fruits3 = ['fig', 'grape'];
let combined = fruits1.concat(fruits2, fruits3);

console.log(combined); // Mostrará: ['apple', 'banana', 'cherry', 'date', 'fig', 'grape']

Ejemplo 3: Unión de un array con elementos

En este ejemplo, al array fruits se le añaden los elementos cherry y date, creando un nuevo array moreFruits.

JavaScript
let fruits = ['apple', 'banana'];
let moreFruits = fruits.concat('cherry', 'date');

console.log(moreFruits); // Mostrará: ['apple', 'banana', 'cherry', 'date']

7.4 Método indexOf()

El método indexOf() devuelve el primer índice donde se puede encontrar un elemento dado en el array, o -1 si el elemento no se encuentra.

Sintaxis:

array.indexOf(searchElement, fromIndex);

Dónde:

  • searchElement: elemento que se necesita encontrar
  • fromIndex: índice desde el cual comenzar la búsqueda. Si no se especifica, la búsqueda comienza desde el inicio del array

Ejemplo 1: Búsqueda de un elemento en el array

En este ejemplo, el método indexOf() devuelve el índice del elemento banana en el array fruits.

JavaScript
let fruits = ['apple', 'banana', 'cherry'];
let index = fruits.indexOf('banana');

console.log(index); // Mostrará: 1

Ejemplo 2: Elemento no encontrado

En este ejemplo, el método indexOf() devuelve -1, ya que el elemento date no se encuentra en el array fruits.

JavaScript
let fruits = ['apple', 'banana', 'cherry'];
let index = fruits.indexOf('date');

console.log(index); // Mostrará: -1

Ejemplo 3: Búsqueda de un elemento desde un índice específico

En este ejemplo, el método indexOf() empieza la búsqueda del elemento banana desde el índice 2 y lo encuentra en el índice 3.

JavaScript
let fruits = ['apple', 'banana', 'cherry', 'banana'];
let index = fruits.indexOf('banana', 2);

console.log(index); // Mostrará: 3
1
Tarea
Frontend SELF ES,  nivel 38lección 0
Bloqueada
Copia de una parte del array
Copia de una parte del array
1
Tarea
Frontend SELF ES,  nivel 38lección 0
Bloqueada
Búsqueda de índice
Búsqueda de índice
Comentarios
  • Populares
  • Nuevas
  • Antiguas
Debes iniciar sesión para dejar un comentario
Esta página aún no tiene comentarios