ECMAScript 6.- Desestructuración de Arrays

 

Creación de Array

const persona = ['Erik', 27 , 'Mexico'];

   Para llamar un elemento del array debemos hacerlo por índices , luego podemos guardarlo en una variable .

En este caso vamos a imprimirlos en consola, pero los usos pueden ser múltiples.

const persona = ['Erik', 27 , 'Mexico'];

const nombre = persona[0]

 const edad = persona[1]

 const pais = persona[2]

 

 console.log(edad)  // 27

Resultado de consola

 En caso de que nuestro array tenga muchos mas elementos o queramos llamarlos múltiples veces en nuestra aplicación , esto se empieza a complicar y dificultar su lectura.

ECMAScript 6 nos permite por medio de la siguiente sintaxis darle un nombre a cada elemento del Array de una forma mas legible.

const persona = ['Erik', 27 , 'Mexico'];

 const [nombre,edad,pais] = persona

 console.log(edad)

 

Resultado de consola

¿Que pasa si no queremos nombrar todos los elementos?

-Vamos a dejar sin nombrar el 2do elemento , simplemente dejando su espacio vacío.

const persona = ['Erik', 27 , 'Mexico'];

 const [nombre,,pais] = persona

 console.log(pais)

Resultado de consola

-Vamos a dejar sin nombrar el 1er elemento.

const persona = ['Erik', 27 , 'Mexico'];

const [ , edad,pais] = persona 

 console.log(pais)

Resultado de consola

Podemos combinar la Desestructuración con el parámetro rest  y con Parámetros por defecto.

La desestructuración también puedes usarse con objetos

Pero eso será cuestión de otros artículos , practica y domina este articulo antes de avanzar.

Despedida

Esperemos te haya servido de utilidad este articulo , síguenos en nuestras redes sociales para seguir aprendiendo juntos , compártenos cualquier duda o comentario que te haya surgido , puede ayudarnos a crecer a ambos.

TE DEJAMOS UNA imagen que puedes guardar como apuntes de tu progreso