Según tengo entendido, las matrices de JavaScript se pueden desestructurar de acuerdo con un índice específico haciendo lo siguiente.
const { 3: selectedByIndex } = arr;
Esto asignaría el valor del elemento en el índice 3 a la variable selectedByIndex .
¿Hay alguna forma de pasar un valor de índice variable para desestructurar la matriz? Lo siguiente no funciona, parece buscar la propiedad index en arr .
const index = 3;
const arr = [1, 2, 3, 4, 5]
const { index: selectedByIndex } = arr;
Sí, puede establecer el index dentro de los corchetes.
const index = 3;
const arr = [1, 2, 3, 4, 5]
const { [index]: selectedByIndex } = arr;
console.log(selectedByIndex)
Mientras esto funciona
const a = [1, 2, 3];
const index = 2;
const [,,v1] = a;
// v1 = 3
const { [index]: v2 } = a;
// v2 = 3
La segunda solución ( v2 ) es una mala práctica de diseño, porque una matriz no es un objeto, pero se accede a ella como tal.
Una mejor solución sería cualquiera
const v3 = a[index];
const v4 = a?.[index];
En otras words, la desestructuración es cuando conoce el formato de la estructura de datos. De lo contrario, a las matrices de JavaScript no les importa si intenta obtener un valor fuera de límite, a menos que el valor no sea una matriz, en cuyo caso necesita un encadenamiento opcional (por ejemplo, v4 ).
Para aclarar lo que quise decir con que la segunda solución es una "mala práctica de diseño", considere este punto de referencia :
// tested on Chrome 105 Firefox 105
let value = list[index]; // fastest, base fastest, base
let value = list?.[index]; // 2.52% slower 3.74% slower
let { [index]: value } = list; // 47.72% slower 30.76% slower
No es porque exista una función y funcione que 1) sea eficiente o 2) sea una buena opción de diseño. Después de todo, ciertamente puedo dar en el clavo con una llave para tubos, pero hay mejores herramientas para el trabajo.
De la misma manera que pasa una clave variable al crear un objeto, colóquelo en [] .
const index = 3;
const arr = [1, 2, 3, 4, 5]
const { [index]: selectedByIndex } = arr;
console.log(selectedByIndex);
Pero a menos que esto sea solo una parte de un patrón de desestructuración más complejo, arr[index] es obviamente más simple.