javascript - tag - title of page html

Desestructuración de objetos sin var

Question

¿Por qué la desestructuración de objetos arroja un error si no hay una palabra clave var frente a ella?

{a, b} = {a: 1, b: 2};

lanza SyntaxError: expected expression, got ''=''

Los siguientes tres ejemplos funcionan sin problemas

var {a, b} = {a: 1, b: 2};
var [c, d] = [1, 2];
[e, f] = [1, 2];

Pregunta adicional: ¿Por qué no necesitamos una var para la desestructuración de la matriz?

Me encontré con el problema haciendo algo como

function () {
var {a, b} = objectReturningFunction();
// Now a and b are local variables in the function, right?
// So why can''t I assign values to them?
{a, b} = objectReturningFunction();
}

Answer 1

El problema surge de los {...} operadores que tienen múltiples significados en JavaScript.

Cuando { aparece al comienzo de una Declaración , siempre representará un block que no se puede asignar. Si aparece más adelante en la Declaración como una Expresión , entonces representará un Objeto.

La var ayuda a hacer esta distinción, ya que no puede ir seguida de una Declaración , como lo hará el paréntesis de agrupación :

( {a, b} = objectReturningFunction() );

Desde sus documentos: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment#Assignment_without_declaration

Notas: Los paréntesis (...) alrededor de la declaración de asignación son obligatorios cuando se usa la asignación de desestructuración literal de objetos sin una declaración.

{a, b} = {a: 1, b: 2} no es una sintaxis independiente válida, ya que {a, b} en el lado izquierdo se considera un bloque y no un objeto literal.

Sin embargo, ({a, b} = {a: 1, b: 2}) es válido, al igual que var {a, b} = {a: 1, b: 2}

Su expresión (...) debe estar precedida por un punto y coma o puede usarse para ejecutar una función en la línea anterior.

Answer 2

Si escribe JavaScript sin punto y coma , la sintaxis de ''asignación sin declaración'' debe ir precedida de un punto y coma para que funcione de manera predecible

let a, b
;({a, b} = objectReturningFunction()) // <-- note the preceding ;

Solo quería resaltar esto, ya que me sorprendió, y espero poder ahorrarles a otros un poco de tiempo para descubrir por qué no funciona y / o produce resultados extraños con formateadores de código, etc.

De hecho, en realidad está justo ahí en la respuesta aceptada (última línea de los documentos citados) pero es fácil pasarlo por alto, ¡especialmente sin ver un ejemplo!