Añadir elementos a un array JavaScript

Añadir elementos a un array JavaScript

En el siguiente tutorial aprenderemos cómo añadir elementos a un array utilizando las funciones push, unshift y splice de JavaScript

Función push

Se utiliza para añadir nuevos elementos al final de un array y devuelve su nueva longitud

Ejemplo 1

Tenemos un array con 3 elementos y vamos a añadir uno más al final con la función push

var frutas = ["manzana", "kiwi", "pera"];
// Obtenemos la longitud del array
var longitud1 = frutas.length;
// longitud1 vale 3
// Añadimos un nuevo elemento
var longitud2 = frutas.push("melocoton");
// Ahora frutas contiene también "melocoton"
// longitud2 valdrá ahora 4

Ejemplo 2

En este ejemplo añadiremos varios elementos a la vez

var frutas = ["manzana", "kiwi", "pera"];
// Añadimos 2 elementos al array
var longitud2 = frutas.push("melocoton", "uva");
// Ahora frutas contiene también "melocoton" y uva
// longitud2 valdrá ahora 5

Función unshift

Se utiliza para añadir nuevos elementos al principio de un array. También devuelve su nueva longitud

Ejemplo 1

Tenemos un array con 3 elementos y vamos a añadir 2 más al principio

var frutas = ["Banana", "Orange", "Apple"];
frutas.unshift("Lemon", "Pineapple");
// frutas vale "Lemon, Pineapple, Banana, Orange, Apple"

Ejemplo 2

Tenemos un array con 3 elementos y vamos a añadir uno más al principio con la función unshift

var frutas = ["manzana", "kiwi", "pera"];
// Añadimos 2 elementos al array
var longitud2 = frutas.unshift("melocoton");
// Ahora frutas contiene también "melocoton"
// frutas vale ["melocoton", "manzana", "kiwi", "pera"]
// longitud2 valdrá ahora 4

Función splice

La función splice se utiliza para añadir elementos a un array en una posición concreta y también para eliminar elementos.

array.splice(posición,elementos a borrar,»elementos a insertar»);

Ejemplos

Añadir elementos a un Array

var fruits = ["Banana", "Orange", "Apple", "Mango"];
var resultado = fruits.splice(2, 0, "Lemon", "Kiwi");

En la posición 2, añade Lemon y Kiwi y borra 0. Resultado: Banana,Orange,Lemon,Kiwi,Apple,Mango

Añadir elementos a un Array y borrar uno.

var fruits = ["Banana", "Orange", "Apple", "Mango"];
var resultado = fruits.splice(2, 1, "Lemon", "Kiwi");

En la posición 2, añade Lemon y Kiwi y borra 1. Resultado: Banana, Orange, Lemon, Kiwi, Mango

Borrar elementos de un Array

var fruits = ["Banana", "Orange", "Apple", "Mango", "Kiwi"];
var resultado = fruits.splice(2, 2);

En la posición 2 borra 2. Resultado: Banana, Orange, Kiwi

Más información sobre el método splice() en: https://www.w3schools.com/jsref/jsref_splice.asp

Más información en Métodos Arrays JavaScript

Más tutoriales de JavaScript