Método push en JavaScript

| Última modificación: 25 de octubre de 2024 | Tiempo de Lectura: 3 minutos

Algunos de nuestros reconocimientos:

Premios KeepCoding

Cuando hablamos de métodos en JavaScript nos referimos a aquellas funciones que actúan en el comportamiento de un objeto directamente. Por ello, son una parte fundamental de la programación funcional, un estilo que se basa en las funciones para crear la mayoría de sus funciones. En este post, te enseñaremos cómo funciona el método push en JavaScript, uno de los métodos más usados para modificar los elementos de un objeto array.

¿Qué es el método push en JavaScript?

El método push en JavaScript es una de las funciones que tenemos a nuestra disposición en este lenguaje de programación para manipular los elementos de un array, que debes conocer antes de aprender sobre .push JS. Un array, también conocido como arreglo en español, es un conjunto de elementos introducido por corchetes [ ]. Los elementos dentro de él pueden ser de todo tipo, desde null hasta números, y se separan por comas. Al ser realmente un tipo de listado de elementos, un objeto array en determinado momento tiene un número de elementos específico que hemos aprendido a recorrer con los bucles for.

Entonces, el método push en JavaScript es una función que nos permite añadir un nuevo elemento al final de un array. Al igual que otros métodos para manipular arrays como map y filter, este método push en JavaScript funciona a modo de caja. Piensa que este método es como una caja con un hueco de entrada y uno de salida. Entonces, al definir un array original estamos definiendo los valores de entrada a la caja. Una vez el método de push en JavaScript ejecuta su función, que es añadir un elemento al final, obtendremos un nuevo array en el hueco de salida de la caja. En el caso de este método de psuh js, obtendremos el mismo array original con el nuevo elemento y una nueva longitud.

Ten presente que, ya que con este método de push java script añadimos nuevos elementos, estamos afectando directamente la propiedad de longitud del array. Esto quiere decir que cuando accedamos a la propiedad de push en JavaScript usando el comando array.length, tendremos distintos resultados antes y después del método de push JS.

¿Cómo utilizar el método push en JavaScript?

Para utilizar el método push en JavaScript, usamos la sintaxis arrayOriginal.push (elementosNuevos). A continuación, puedes ver un ejemplo de cómo se escribe. Supongamos que para push JavaScript tenemos un array original sobre colores:

const arrColoresPrimarios = [‘azul’, ‘amarillo’, ‘rojo’]

Ahora, queremos añadirle tres colores. Para ello, utilizamos el método push de la siguiente manera:

arrColoresPrimarios.push (‘morado’, ‘naranja’, ‘verde’)

Para pintar este resultado de push JavaScript en la pantalla, podemos añadirle el comando console.log directamente antes del método. Sin embargo, si quieres tener la posibilidad de pintar en pantalla el array original y el nuevo por separado, te recomendamos igualar este método a una nueva variable. A continuación, te mostramos cómo:

const arrColores = arrColoresPrimarios.push (‘morado’, ‘naranja’, ‘verde’)

Ahora, podemos utilizar las dos distintas variables para pintar resultados diferentes. El primer array del push JavaScript se pintaría de la siguiente manera:

console.log (arrColoresPrimarios)

//resultado esperado: [‘azul’, ‘amarillo’, ‘rojo’]

console.log (arrColores)

// resultado esperado: [‘azul’, ‘amarillo’, ‘rojo’, ‘morado’, ‘naranja’, ‘verde’]

Desde KeepCoding, te recomendamos esta práctica de push cuando quieras mantener el array original sin ser modificado. Cuando no le asignamos una nueva variable al método push, estamos modificando directamente su contenido. Esto también afectará la forma en la que se almacena, como puedes leer en nuestro post sobre los arrays y la memoria RAM.

¿Quieres seguir aprendiendo?

Ahora que sabes qué es y cómo funciona el método push en JavaScript, seguro que quieres seguir aprendiendo sobre los distintos elementos y funciones que este lenguaje de programación pone a tu disposición. Para ello, te recomendamos nuestro Desarrollo Web Full Stack Bootcamp, una formación intensiva donde aprenderás todo lo necesario para convertirte en un experto en desarrollo web en pocos meses. Entre los temas que se dan en los diferentes módulos, aprenderás a dominar lenguajes de programación como JavaScript, CSS y HTML y a conceptos como push. ¡No lo dudes más y matricúlate ahora!

Alberto Casero

Alberto Casero es CTO en Watium, Fundador de Kas Factory & Coordinador del Bootcamp en Desarrollo Web.

Posts más leídos

¡CONVOCATORIA ABIERTA!

Desarrollo Web

Full Stack Bootcamp

Clases en Directo | Profesores en Activo | Temario 100% actualizado