¿Cómo agregar un elemento a un array en JavaScript?

Estrada Web Group
Estrada Web Group
¿Cómo agregar un elemento a un array en JavaScript?

El método .push() de JavaScript es un método muy útil para agregar elementos al final de una Array o arreglo. Después de agregar un elemento al final de la Array, el método .push() devuelve la nueva longitud de la matriz.

Sintaxis

arr.push(element1, element2, etc...)

El método .push() acepta tipos de datos String , Numéricos, Booleanos, Objetos, Undefined y Null.

Probémoslo con unos ejemplos

Strings

En este ejemplo, vamos a crear una matriz de String y vamos a declarar en la variable colores. Entonces vamos a añadirle el color naranja.


var colores = ['rojo', 'verde', 'amarillo', 'azul'];
colores.push('naranja'); // Regresa: 5
console.log(colores);  // regresa: ['rojo', 'verde', 'amarillo', 'azul', 'naranja']

Números

Aquí crearemos un arreglo tipo number llamada testScores y luego agregamos dos nuevas puntuaciones de prueba al array al mismo tiempo.


var testScores = [77, 98, 81, 76];
testScores.push(100, 71); // Regresa: 6
console.log(testScores); // Regresa: [77, 98, 81, 76, 100, 71];

Objetos

En el ejemplo anterior, enviamos los puntajes de las pruebas a la matriz, pero eso no es muy útil para el usuario final. Sería bueno ver los nombres de los estudiantes para los cuales se obtuvieron las calificaciones, de modo que podamos hacer un seguimiento de todos ellos en un solo lugar. Agregamos un Object a nuestra matriz en su lugar.

Crear una matriz de estudiantes de tipo Object.


var estudiantes = [
        {
           nombreEstudiante: 'Billy',
           testScore: 77
        },
        {
           nombreEstudiante: 'Sandra',
           testScore: 98
        },
        {
           nombreEstudiante: 'Michelle',
           testScore: 81
        },
        {
           nombreEstudiante: 'Jason',
           testScore: 76
        }
];

A continuación, tomemos la matriz de nuestros estudiantes y agregaremos las calificaciones de Andrea y Timmy.


estudiantes.push({nombreEstudiante: 'Andrea', testScore: 100}, { nombreEstudiante: 'Timmy', testScore: 71});

Ve más allá

También podemos ir un paso más allá al acceder a la información de un estudiante en particular. Digamos que queremos ver el score de Andrea, ¿cómo haríamos eso?

Podemos hacerlo lo siguiente:


console.log(estudiantes [4]. nombreEstudiante); // Resultado: Andrea
console.log(estudiantes [4].['testScore']); //Resultado: 100

Conclusión

Como puedes ver, el método .push() tiene mucha utilidad cuando estamos desarrollando, y ciertamente es uno de los fundamentos para tratar con Arrays.

Si tiene alguna pregunta o si desea ver ejemplos adicionales, no dudes en comunicarse conmigo en cualquier momento en info@estradawebgroup.com o en el apartado de contacto, y si estás disfrutando de mis publicaciones házmelo saber en el apartado de los comentarios.

Artículos de la serie:

Compartir artículo:

Más artículos geniales

¿Cómo utilizar getters y setters para mejorar tus clases en JavaScript?

¿Cómo utilizar getters y setters para mejorar tus clases en JavaScript?

Los getters te permiten obtener el valor de una propiedad de un objeto, mientras que los setters te permiten establecer el valor de una propiedad de un objeto. Los getters y setters pueden usarse para validar la entrada de datos

Ver artículo completo
Cómo obtener el residuo o resto en una división en JavaScript

Cómo obtener el residuo o resto en una división en JavaScript

Resumen: en este tutorial, aprenderá sobre el operador de resto o residuo de JavaScript (%) para obtener el resto de un número dividido por otro número.

Ver artículo completo
Para qué sirve la instrucción continue de JavaScript

Para qué sirve la instrucción continue de JavaScript

Resumen: en este tutorial, aprenderás a usar la instrucción continue de JavaScript para omitir la iteración actual de un bucle, es decir que se brinque la iteración actual.

Ver artículo completo

Manténgase actualizado

Obtenga excelente contenido en su bandeja de entrada todas las semanas.
Solo contenido excelente, no compartimos su correo electrónico con terceros.
Subir al inicio de la pantalla