¿Cómo funciona el índice de un array en JavaScript?

Autor: | Última modificación: 13 de enero de 2023 | Tiempo de Lectura: 3 minutos
Temas en este post:

¿Cómo funciona el índice de un array en JavaScript?

Los arrays son un tipo de objeto en JavaScript que nos permiten enlistar distintos elementos. Con ellos, podemos crear muchas acciones, desde recorrer el listado de elementos para pintarlos en la pantalla hasta crear una fórmula para todos los elementos que queremos pintar. Por ello, entender cómo funciona es fundamental a la hora de programar. En este post, te explicaremos una de sus características básicas: cómo funciona el índice de un array en JavaScript.

Diferencia entre array y objeto en JavaScript

Un array es un objeto de JavaScript que contiene una lista de elementos. A diferencia de un objeto literal, que contiene distintas propiedades bajo el comando clave: valor, un objeto array contiene una lista de elementos separados por comas. Mientras que los objetos literales se introducen con los símbolos de llaves { }, los objetos array lo hacen con corchetes [ ]. Entonces, un array puede contener todo tipo de valores primitivos.

A continuación, te mostramos distintos array con diferentes elementos:

const nombres = [‘Valentina’, ‘Gabriela’, ‘Andrés’]

let edades = [23, 21, 19]

Como ves, un array puede contener strings o números, pero también otros valores, como undefined y null.

Un aspecto muy interesante de este tipo de objetos es que tienen una variedad de métodos a disposición que nos permiten modificar los comportamientos de sus elementos. Ya sea para filtrar, transformar o manipular los elementos, hay un método para casi todas las acciones que queramos ejecutar en un array. Por su uso de funciones, este aspecto de los arrays es muy importante para la programación funcional.

Para conocer más sobre las características, propiedades y métodos de los objetos array, te invitamos a consultar el post de la página oficial de Mozilla Developer Network sobre el tema.

¿Cómo funciona el índice de un array en JavaScript?

¿Cómo funciona un índice JavaScript? Al ser un listado de elementos, un objeto array contiene un número determinado de valores, al que podemos acceder usando el método array.lenght. Además, en este listado, cada uno de los elementos tiene una posición a la que podemos acceder de distintas maneras. El orden de las posiciones de los elementos en un array se conoce como índice o index. A continuación, te enseñamos exactamente cómo funciona el índice de un array en JavaScript.

En el mundo de la programación, la mayoría de las veces en las que hablemos de un orden o índice, este empezará desde el número 0. Entonces, el índice de un array en JavaScript se organiza de izquierda a derecha empezando por el número 0.

Supongamos que tenemos el siguiente array:

let verduras = [‘zanahoria’, ‘cebolla’, ‘pepino’, ‘lechuga’, ‘calabaza’, ‘berenjena’, ‘pimentón’, ‘espinaca’]

En este caso, el array llamado «verduras» tiene en total ocho elementos. Sin embargo, sus posiciones irán del 0 al 7. A continuación, te mostramos cómo se ordenan:

let verduras = [‘zanahoria’, ‘cebolla’, ‘pepino’, ‘lechuga’, ‘calabaza’, ‘berenjena’, ‘pimentón’, ‘espinaca’]

// indexdelarray [ 0, 1, 2, 3, 4, 5, 6, 7]

Aunque esto puede parecer muy sencillo, la verdad es que es muy común cometer errores sobre la posición de nuestros elementos. Esto sucede especialmente si creamos un array con números consecutivos que empiezan desde el 1:

let números = [ 1, 2, 3, 4, 5, 6, 7, 8]

Es aquí cuando empezamos a cuestionar si el número 3 está en la posición del index 3, aunque realmente está en el índice número 2.

Obtener el index de un array en JavaScript

El índice de un array en JavaScript funciona para seleccionar un elemento específico dentro de un array sin importar su valor. La buena noticia es que no tenemos que sabernos el índice de memoria ni necesitamos contar la posición de cada elemento para conocer su orden en el índice, ya que existen varios métodos que nos pueden ayudar a encontrarlo. A continuación, te presentamos algunas funciones de array especialmente enfocadas en el índice:

  • indexOf(): este método nos devuelve como resultado el índice del elemento que hayamos escrito entre paréntesis.
  • findIndex(): este método nos devuelve como resultado el índice del primer elemento que tenga las características de la función insertada entre paréntesis.
  • lastIndexOf(): este método nos devuelve como resultado el índice de la última posición en la que se encuentra un elemento. Resulta especialmente útil para encontrar elementos que se repiten en un array.

Aprende más sobre el índice de un array en JavaScript

Después de leer este post, sabes exactamente cómo funciona el índice de un array en JavaScript y vas por el buen camino para aprender a dominar este lenguaje de programación. Como queda mucho por aprender, te animamos a seguir formándote con nosotros en nuestro Desarrollo Web Full Stack Bootcamp. Allí, además de aprender a dominar JavaScript, conocerás todo lo necesario para ser un experto en desarrollo web. ¡Anímate a matricularte!

👉 Descubre más del Desarrollo Web Full Stack Bootcamp ¡Descarga el temario!

👉 Prueba el Bootcamp Gratis por una Semana ¡Empieza ahora mismo!

👉 Conoce nuestros otros Bootcamps en Programación y Tecnología

[email protected]

¿Trabajo? Aprende a programar y consíguelo.

¡No te pierdas la próxima edición del Aprende a Programar desde Cero Full Stack Jr. Bootcamp!

 

Prepárate en 4 meses, aprende las últimas tecnologías y consigue trabajo desde ya. 

 

Solo en España hay más de 120.400 puestos tech sin cubrir, y con un sueldo 11.000€ por encima de la media nacional. ¡Es tu momento!

 

🗓️ Próxima edición: 13 de febrero

 

Reserva tu plaza descubre las becas disponibles.

¿Sabías que hay más de 40.000 vacantes para desarrolladores web sin cubrir en España? 

En KeepCoding llevamos desde 2012 guiando personas como tú a áreas de alta empleabilidad y alto potencial de crecimiento en IT con formación de máxima calidad.

 

Porque creemos que un buen trabajo es fuente de libertad, independencia, crecimiento y eso ¡cambia historias de vida!


¡Da el primer paso!