feat(5326): allow destructuring with parameter properties

src/compiler/binder.ts

@@ -3328,11 +3328,29 @@ namespace ts {
                 declareSymbolAndAddToSymbolTable(node, SymbolFlags.FunctionScopedVariable, SymbolFlags.ParameterExcludes);
             }
 
-            // If this is a property-parameter, then also declare the property symbol into the
-            // containing class.
+            // If this is a property-parameter, then also declare the property symbol into the containing class.
             if (isParameterPropertyDeclaration(node, node.parent)) {
-                const classDeclaration = node.parent.parent;
-                declareSymbol(classDeclaration.symbol.members!, classDeclaration.symbol, node, SymbolFlags.Property | (node.questionToken ? SymbolFlags.Optional : SymbolFlags.None), SymbolFlags.PropertyExcludes);
+                const symbol = node.parent.parent.symbol;
+                const members = symbol.members!;
+
+                if (isBindingPattern(node.name)) {
+                    bindParameterPropertyFromBindingPattern(node.name, members, symbol);
+                }
+                else {
+                    declareSymbol(members, symbol, node, SymbolFlags.Property | (node.questionToken ? SymbolFlags.Optional : SymbolFlags.None), SymbolFlags.PropertyExcludes);
+                }
+            }
+        }
+
+        function bindParameterPropertyFromBindingPattern(node: ObjectBindingPattern | ArrayBindingPattern, symbolTable: SymbolTable, parent: Symbol | undefined) {
+            for (const element of node.elements) {
+                if (isOmittedExpression(element)) continue;
+                if (isObjectBindingPattern(element.name) || isArrayBindingPattern(element.name)) {
+                    bindParameterPropertyFromBindingPattern(element.name, symbolTable, parent);
+                }
+                else {
+                    declareSymbol(symbolTable, parent, element, SymbolFlags.Property, SymbolFlags.PropertyExcludes);
+                }
             }
         }
 

src/compiler/checker.ts

@@ -41246,9 +41246,6 @@ namespace ts {
             else if ((node.kind === SyntaxKind.ImportDeclaration || node.kind === SyntaxKind.ImportEqualsDeclaration) && flags & ModifierFlags.Ambient) {
                 return grammarErrorOnNode(lastDeclare!, Diagnostics.A_0_modifier_cannot_be_used_with_an_import_declaration, "declare");
             }
-            else if (node.kind === SyntaxKind.Parameter && (flags & ModifierFlags.ParameterPropertyModifier) && isBindingPattern((node as ParameterDeclaration).name)) {
-                return grammarErrorOnNode(node, Diagnostics.A_parameter_property_may_not_be_declared_using_a_binding_pattern);
-            }
             else if (node.kind === SyntaxKind.Parameter && (flags & ModifierFlags.ParameterPropertyModifier) && (node as ParameterDeclaration).dotDotDotToken) {
                 return grammarErrorOnNode(node, Diagnostics.A_parameter_property_cannot_be_declared_using_a_rest_parameter);
             }

src/compiler/diagnosticMessages.json

@@ -583,10 +583,6 @@
         "category": "Error",
         "code": 1186
     },
-    "A parameter property may not be declared using a binding pattern.": {
-        "category": "Error",
-        "code": 1187
-    },
     "Only a single variable declaration is allowed in a 'for...of' statement.": {
         "category": "Error",
         "code": 1188

src/compiler/transformers/ts.ts

@@ -1962,8 +1962,9 @@ namespace ts {
             //      this.x = x;
             //      this.y = y;
             //  }
-            //
-            addRange(statements, map(parametersWithPropertyAssignments, transformParameterWithPropertyAssignment));
+
+            addRange(statements, flatMap(parametersWithPropertyAssignments, p =>
+                isObjectBindingPattern(p.name) || isArrayBindingPattern(p.name) ? transformBindingPatternWithPropertyAssignment(p.name) : transformParameterNameWithPropertyAssignment(p.name)));
 
             // Add the existing statements, skipping the initial super call.
             addRange(statements, visitNodes(body.statements, visitor, isStatement, indexOfFirstStatement));
@@ -1976,23 +1977,19 @@ namespace ts {
             return block;
         }
 
-        /**
-         * Transforms a parameter into a property assignment statement.
-         *
-         * @param node The parameter declaration.
-         */
-        function transformParameterWithPropertyAssignment(node: ParameterPropertyDeclaration) {
-            const name = node.name;
-            if (!isIdentifier(name)) {
-                return undefined;
-            }
+        function transformBindingPatternWithPropertyAssignment(node: ObjectBindingPattern | ArrayBindingPattern): readonly ExpressionStatement[] {
+            return flatMap(node.elements, n => isOmittedExpression(n) ? undefined :
+                isObjectBindingPattern(n.name) || isArrayBindingPattern(n.name) ? transformBindingPatternWithPropertyAssignment(n.name) :
+                    transformParameterNameWithPropertyAssignment(n.name));
+        }
 
+        function transformParameterNameWithPropertyAssignment(node: Identifier) {
             // TODO(rbuckton): Does this need to be parented?
-            const propertyName = setParent(setTextRange(factory.cloneNode(name), name), name.parent);
+            const propertyName = setParent(setTextRange(factory.cloneNode(node), node), node.parent);
             setEmitFlags(propertyName, EmitFlags.NoComments | EmitFlags.NoSourceMap);
 
             // TODO(rbuckton): Does this need to be parented?
-            const localName = setParent(setTextRange(factory.cloneNode(name), name), name.parent);
+            const localName = setParent(setTextRange(factory.cloneNode(node), node), node.parent);
             setEmitFlags(localName, EmitFlags.NoComments);
 
             return startOnNewLine(
@@ -2006,12 +2003,12 @@ namespace ts {
                                             factory.createThis(),
                                             propertyName
                                         ),
-                                        node.name
+                                        node
                                     ),
                                     localName
                                 )
                             ),
-                            node
+                            node.parent
                         ),
                         moveRangePos(node, -1)
                     )

tests/baselines/reference/declarationEmitDestructuringParameterProperties.js

@@ -20,18 +20,27 @@ class C3 {
 var C1 = /** @class */ (function () {
     function C1(_a) {
         var x = _a[0], y = _a[1], z = _a[2];
+        this.x = x;
+        this.y = y;
+        this.z = z;
     }
     return C1;
 }());
 var C2 = /** @class */ (function () {
     function C2(_a) {
         var x = _a[0], y = _a[1], z = _a[2];
+        this.x = x;
+        this.y = y;
+        this.z = z;
     }
     return C2;
 }());
 var C3 = /** @class */ (function () {
     function C3(_a) {
         var x = _a.x, y = _a.y, z = _a.z;
+        this.x = x;
+        this.y = y;
+        this.z = z;
     }
     return C3;
 }());

tests/baselines/reference/declarationEmitPrivatePromiseLikeInterface.js

@@ -52,10 +52,10 @@ exports.Api = void 0;
 var Api = /** @class */ (function () {
     function Api(http) {
         var _this = this;
-        this.http = http;
         this.abc1 = function () { return _this.http.request(); };
         this.abc2 = function () { return _this.http.request(); };
         this.abc3 = function () { return _this.http.request(); };
+        this.http = http;
     }
     return Api;
 }());

tests/baselines/reference/destructuringParameterProperties1.js

@@ -33,18 +33,27 @@ var [c3_x, c3_y, c3_z] = [c3.x, c3.y, c3.z];
 var C1 = /** @class */ (function () {
     function C1(_a) {
         var x = _a[0], y = _a[1], z = _a[2];
+        this.x = x;
+        this.y = y;
+        this.z = z;
     }
     return C1;
 }());
 var C2 = /** @class */ (function () {
     function C2(_a) {
         var x = _a[0], y = _a[1], z = _a[2];
+        this.x = x;
+        this.y = y;
+        this.z = z;
     }
     return C2;
 }());
 var C3 = /** @class */ (function () {
     function C3(_a) {
         var x = _a.x, y = _a.y, z = _a.z;
+        this.x = x;
+        this.y = y;
+        this.z = z;
     }
     return C3;
 }());

tests/baselines/reference/destructuringParameterProperties1.symbols

@@ -50,10 +50,18 @@ c1 = new C1(["larry", "{curly}", "moe"]);
 
 var useC1Properties = c1.x === c1.y && c1.y === c1.z;
 >useC1Properties : Symbol(useC1Properties, Decl(destructuringParameterProperties1.ts, 21, 3))
+>c1.x : Symbol(C1.x, Decl(destructuringParameterProperties1.ts, 1, 24))
 >c1 : Symbol(c1, Decl(destructuringParameterProperties1.ts, 19, 3))
+>x : Symbol(C1.x, Decl(destructuringParameterProperties1.ts, 1, 24))
+>c1.y : Symbol(C1.y, Decl(destructuringParameterProperties1.ts, 1, 26))
 >c1 : Symbol(c1, Decl(destructuringParameterProperties1.ts, 19, 3))
+>y : Symbol(C1.y, Decl(destructuringParameterProperties1.ts, 1, 26))
+>c1.y : Symbol(C1.y, Decl(destructuringParameterProperties1.ts, 1, 26))
 >c1 : Symbol(c1, Decl(destructuringParameterProperties1.ts, 19, 3))
+>y : Symbol(C1.y, Decl(destructuringParameterProperties1.ts, 1, 26))
+>c1.z : Symbol(C1.z, Decl(destructuringParameterProperties1.ts, 1, 29))
 >c1 : Symbol(c1, Decl(destructuringParameterProperties1.ts, 19, 3))
+>z : Symbol(C1.z, Decl(destructuringParameterProperties1.ts, 1, 29))
 
 var c2 = new C2(["10", 10, !!10]);
 >c2 : Symbol(c2, Decl(destructuringParameterProperties1.ts, 23, 3))
@@ -63,9 +71,15 @@ var [c2_x, c2_y, c2_z] = [c2.x, c2.y, c2.z];
 >c2_x : Symbol(c2_x, Decl(destructuringParameterProperties1.ts, 24, 5))
 >c2_y : Symbol(c2_y, Decl(destructuringParameterProperties1.ts, 24, 10))
 >c2_z : Symbol(c2_z, Decl(destructuringParameterProperties1.ts, 24, 16))
+>c2.x : Symbol(C2.x, Decl(destructuringParameterProperties1.ts, 8, 24))
 >c2 : Symbol(c2, Decl(destructuringParameterProperties1.ts, 23, 3))
+>x : Symbol(C2.x, Decl(destructuringParameterProperties1.ts, 8, 24))
+>c2.y : Symbol(C2.y, Decl(destructuringParameterProperties1.ts, 8, 26))
 >c2 : Symbol(c2, Decl(destructuringParameterProperties1.ts, 23, 3))
+>y : Symbol(C2.y, Decl(destructuringParameterProperties1.ts, 8, 26))
+>c2.z : Symbol(C2.z, Decl(destructuringParameterProperties1.ts, 8, 29))
 >c2 : Symbol(c2, Decl(destructuringParameterProperties1.ts, 23, 3))
+>z : Symbol(C2.z, Decl(destructuringParameterProperties1.ts, 8, 29))
 
 var c3 = new C3({x: 0, y: "", z: false});
 >c3 : Symbol(c3, Decl(destructuringParameterProperties1.ts, 26, 3))
@@ -85,7 +99,13 @@ var [c3_x, c3_y, c3_z] = [c3.x, c3.y, c3.z];
 >c3_x : Symbol(c3_x, Decl(destructuringParameterProperties1.ts, 28, 5))
 >c3_y : Symbol(c3_y, Decl(destructuringParameterProperties1.ts, 28, 10))
 >c3_z : Symbol(c3_z, Decl(destructuringParameterProperties1.ts, 28, 16))
+>c3.x : Symbol(C3.x, Decl(destructuringParameterProperties1.ts, 15, 24))
 >c3 : Symbol(c3, Decl(destructuringParameterProperties1.ts, 26, 3))
+>x : Symbol(C3.x, Decl(destructuringParameterProperties1.ts, 15, 24))
+>c3.y : Symbol(C3.y, Decl(destructuringParameterProperties1.ts, 15, 27))
 >c3 : Symbol(c3, Decl(destructuringParameterProperties1.ts, 26, 3))
+>y : Symbol(C3.y, Decl(destructuringParameterProperties1.ts, 15, 27))
+>c3.z : Symbol(C3.z, Decl(destructuringParameterProperties1.ts, 15, 30))
 >c3 : Symbol(c3, Decl(destructuringParameterProperties1.ts, 26, 3))
+>z : Symbol(C3.z, Decl(destructuringParameterProperties1.ts, 15, 30))