¿Usando el operador spread varias veces en javascript?
ecmascript-6 spread-syntax (3)
¿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 :
[ Elision_opt ]
[ ElementList ]
[ ElementList , Elision_opt ]
ElementList :
Elision_opt SpreadElement
ElementList , Elision_opt SpreadElement
SpreadElement:
... AssignmentExpression
Arguments :
( )
( ArgumentList )
ArgumentList :
AssignmentExpression
... AssignmentExpression
ArgumentList , AssignmentExpression
ArgumentList , ... AssignmentExpression
¿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 ]
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));
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))