Unerwartetes Destrukturierungsverhalten, zweimaliges Deklinieren eines Schlüssels beim Destrukturieren

Question

Ich habe in ES6 etwas Destrukturierung durchgeführt und bin in eine unerwartete Situation geraten. Hier ist eine trivialisierte Version von dem, was passiert ist.

let obj = {x: {y: 5}}; 
let {x: {y}} = obj; 

console.log(x); // x is not defined 
console.log(y); // 5 

In meinem Anwendungsfall, brauchte ich Zugang sowohl zu x und y. Ich hätte erwartet, dass auch x destrukturiert wurde. Stattdessen die gewünschte Wirkung zu bekommen, musste ich dies tun:

let obj = {x: {y: 5}}; 
let {x, x: {y}} = obj; 

console.log(x); // {"y":5} 
console.log(y); // 5 

Aber ich denke, {x, x: {y}} seltsam und nicht intuitiv aussieht. Gibt es ein Destrukturierungsgeheimnis, das mir nicht bekannt ist, oder ist das nur eine winzige Störung der Destrukturierung?

Answer 1

Es ist keine Fallstricke, aber das erwartete Verhalten, etwas, das durch destructuring syntax definiert ist.

Möglicherweise ist AssignmentPropertyList in ObjectAssignmentPattern und verschachtelt AssignmentPropertyList in AssignmentPropertyList. Jede AssignmentPropertyList kann entweder AssignmentProperty oder PropertyName : AssignmentElement sein.

In diesem Fall

let {x, x: {y}} = obj; 

der erste xAssignmentProperty ist, ist der zweite xPropertyName.

Die Idee hinter verschachtelter Destrukturierung besteht darin, einen Pfad für verschachtelte Eigenschaften bereitzustellen, die destrukturiert werden. Das erwartete Verhalten ist nicht erhalten unerwünschte Variablen für jede Ebene der verschachtelten Destrukturierung, Zwischen x sollte bei Bedarf explizit destrukturiert werden.

Es sollte nichts seltsam oder nicht intuitiv in dieser Syntax für den Entwickler sein, der damit vertraut ist. Die Variation, die näher an ist, was der Code tut (und möglicherweise besser lesbar) ist

let {x} = obj; 
let {y} = x; 

Answer 2

Dieses:

let {x: {y}} = obj; 

ist eine Abkürzung für:

let {x: {y: y}} = obj; 

Destrukturierung passt die Doppelpunkte linke Seiten (die Schlüssel) gegen die Daten und setzt die Ergebnisse in die rechten Seiten (Zuweisungsziele, in der Regel Variablen). Daher ist x hier nur ein Schlüssel, während y sowohl ein Schlüssel als auch eine neu deklarierte Variable ist.