¿Usando el operador spread varias veces en javascript?

ecmascript-6 spread-syntax

Question

¿Por qué no se puede usar el operador de propagación varias veces?

let arr = [[[1, 2, 3]]];

console.log(arr); // Array [ Array[1] ]
console.log(...arr); // Array [ Array[3] ]
console.log(...(...arr));
// SyntaxError: expected ''=>'' after argument list, got '')''

Yo esperaría:

console.log(...(...arr)); // Array [ 1, 2, 3 ]

Answer 1

¿Por qué no se puede usar el operador de propagación varias veces?

... no es un operador. (...arr) no es JavaScript válido. ... solo se permite dentro de los literales de matriz y en las listas de argumentos, pero esas son formas especiales de la sintaxis (observe el ... en las reglas de producción a continuación).

ArrayLiteral

ArrayLiteral :
  [ Elision_opt ]
  [ ElementList ]
  [ ElementList , Elision_opt ]

ElementList :
  Elision_opt SpreadElement
  ElementList , Elision_opt SpreadElement

SpreadElement:
  ... AssignmentExpression

Arguments

Arguments :
  ( )
  ( ArgumentList )

ArgumentList :
  AssignmentExpression
  ... AssignmentExpression
  ArgumentList , AssignmentExpression
  ArgumentList , ... AssignmentExpression

Answer 2

De acuerdo con this , la entrada de sintaxis extendida es iterable (por ejemplo, matriz), pero su salida de producción no es iterable (por ejemplo, no matriz). Entonces, el problema es que en la sintaxis de propagación externa ... como entrada pones algo no iterable ( ...arr ) que causa SyntaxError. Para aplanar su matriz, puede usar flat (si coloca Infinity en lugar de 2, entonces aplanará cualquier matriz anidada)

arr.flat(2)

let arr = [[[1, 2, 3]]];
console.log(arr.flat(2));

let arr2 = [[1,2,[3,4,[5,[6]]]], [[7,[8]],9]];;
console.log(arr2.flat(Infinity));

Answer 3

Porque ... arr no es como una función que devuelve un valor en escenarios normales (puede probar esto simplemente escribiendo ... [[1,2,3]] en la consola, si ... funciona como una función normal esperaríamos un retorno de [1 2 3]. Por esa razón no puede encadenar spreads. De MDN:

El operador de propagación permite que una expresión se expanda en lugares donde se esperan múltiples argumentos (para llamadas a funciones) o múltiples elementos (para literales de matriz).

Ergo, los spreads deben suceder dentro de literales de matriz, literales de objeto (si se usa obj spread, que es ES7) o dentro de llamadas a funciones Para que pueda hacer console.log (... []. Concat (... arr))