Con JavaScript

Qué quiere decir desestructurar arrays? Vamos a verlo primero con JavaScript

const myarr = ['hola', 'que tal estamos']

Teniendo este array, vamos a mandarlo como argumento de una función

const myarr = ['hola', 'que tal estamos']
const myfunc = arr => console.log(arr)

myfunc(myarr) // ['hola', 'que tal estamos']

Bien

Y qué es desestructurar? Pues es

• ahorrarnos un paso (más o menos)
• y ganar en semanticismo (dudo que exista esta palabra)

Vamos a verlo con el ejemplo anterior pero cambiando el valor del array, para que tenga más sentido

const myfunc = arr => console.log(arr)

const myarr = ['Barcelona', 'Desarrollador']
myfunc(myarr) // ['Barcelona', 'Desarrollador']

Aquí no hemos desestructurado, pero nos sirve para ver el problema que solucionaremos con la desestructuración

• Cuando te miras cómo myfunc recibe el array, no tienes ni idea de qué hay en ese array, y esto complica la lectura de la cosa

Es decir, estás obligado a mirarte la función y a mirarte quién invoca la función

Esto es un problema

Y lo podemos solucionar si desestructuramos

const myfunc = ([place, job]) => console.log(place + ' > ' + job)

const myarr = ['Barcelona', 'Desarrollador']
myfunc(myarr) // Barcelona > Desarrollador

Lo que hemos hecho a nivel semántico es permitir que leyendo la función uno ya sepa lo que está recibiendo con lo que la comprensión gana muchos enteros

A nivel de lenguaje, hemos juntado esto en una única expresión

const myfunc = arr => {
  const [place, job] = arr // aquí es donde estoy desestructurando
  console.log(place + ' > ' + job)
}

Que a su vez condensa lo siguiente

const myfunc = arr => {
  const place = arr[0]
  const job = arr[1]
  console.log(place + ' > ' + job)
}

Sin duda mucho más verbose que la versión desestructurada

Y se puede hacer con objetos también, por ejemplo así

const myfunc = ({ place, job }) => console.log(place + ' > ' + job)

const myobj = { place: 'Barcelona', job: 'Desarrollador' }
myfunc(myobj) // Barcelona > Desarrollador

Vale, no me entretengo más en JS

Y en php?

Con php

En php todo es más complicado, y al revés

Pero en este caso es casi lo mismo

Primero declaramos un array

$myarr = ['Barcelona', 'Desarrollador'];

Y luego lo desestructuramos

[$place, $job] = ['Barcelona', 'Desarrollador'];
echo $place . ' > ' . $job;

Lo puedes probar en writephponline.com

Eso sí, php no es JavaScript y tiene sus peculiaridades

Por ejemplo, un array y un objeto en php son lo mismo

Es como si dijéramos que en JavaScript esto es lo mismo

const myarr = ['hola', 'que tal']
// sería lo mismo que
const myarr = [{ '0': 'hola' }, { '1': 'que tal' }]

Y claro está que no es lo mismo

Lo primero es un array, lo segundo es un objeto con las propiedades 0 y 1

Nada que ver

La noche y el día

Pero en php sí son lo mismo, es decir, esto es equivalente

$myarr = ['Barcelona', 'Desarrollador'];
$myarr = [0 => 'Barcelona', 1 => 'Desarrollador'];

Algo que podemos aprovechar para ampliarlo a nuestro gusto, es decir, aquí podemos mezclar valores simples y valores con key en una misma estructura

$myarr = ['Barcelona', 'Desarrollador', 'estado' => 'contento'];
$myarr = [0 => 'Barcelona', 1 => 'Desarrollador', 'estado' => 'contento'];

Bien

Pues esto también podemos desestructurarlo, pero con su intringulis

Podemos empezar por intentar esto

$myarr = ['Barcelona', 'Desarrollador', 'estado' => 'contento'];
[$place, $job, $estado] = $myarr;
echo $place . ' > ' . $job . ' > ' . $estado; // Barcelona > Desarrollador >

Pero vemos que no estamos cazando a $estado, y esto es porque tenemos que especificarle la key

Pues nada, lo hacemos así

$myarr = ['Barcelona', 'Desarrollador', 'estado' => 'contento'];
[$place, $job, 'estado' => $estado] = $myarr; // error

Pero esto da error 😥

El motivo es porque cuando desestructuramos no podemos mezclar valores con key y valores sin key, por lo que nos obliga a escribirlo de este modo

$myarr = ['Barcelona', 'Desarrollador', 'estado' => 'contento'];
['0' => $place, '1' => $job, 'estado' => $estado] = $myarr;
echo $place . ' > ' . $job . ' > ' . $estado; //  Barcelona > Desarrollador > contento

Y ahora ya sí nos funciona

Listos!