25

编辑

我在 TypeScript 的 Github 存储库上记录了一个问题，他们正在接受 PR 来实现它。

在 TypeScript 中，当我们想从构造函数定义中自动在类中创建属性时，我们可以利用 Parameter Properties 简写，例如：

class Person {
    constructor(public firstName : string, public lastName : number, public age : number) {

    }
}

然后，转译的 Javascript 将是：

var Person = (function () {
    function Person(firstName, lastName, age) {
        this.firstName = firstName;
        this.lastName = lastName;
        this.age = age;
    }
    return Person;
})();

但是如果我们想在构造函数中接收一个对象，它会是这样的：

interface IPerson {
    firstName : string,
    lastName : string,
    age: number
}

class Person {
    constructor(person : IPerson) {
        this.firstName = person.firstName;
        this.lastName = person.lastName;
        this.age = person.age;
    }
}

从 TypeScript 1.5 开始，我们可以利用解构，例如：

class Person {
    constructor({firstName, lastName, age} : {firstName: string, lastName: string, age: number}) {
        this.firstName = firstName;
        this.lastName = lastName;
        this.age = age;
    }
}

问题：如何在 TypeScript 中结合参数属性简写和解构？

我试图public在对象定义之前定义，例如：

class Person {
    constructor(public {firstName, lastName, age} : {firstName: string, lastName: string, age: number}) {

    }
}

试图在每个变量之前定义它，例如：

class Person {
    constructor({public firstName, public lastName, public age} : {firstName: string, lastName: string, age: number}) {

    }
}

但我没有成功。有什么想法吗？

4

3 回答 3

6

如果您有权访问Object.assign，则此方法有效：

class PersonData {
  firstName: string
  constructor(args : PersonData) {
    Object.assign(this, args)
  }
}

class Person extends PersonData{}

但请注意，新实例将由 args 中的任何内容填充——您不能只删除您想要使用的键。

于 2017-08-04T19:22:05.183 回答
3

目前没有办法做到这一点，所以你能得到的最接近的方法是直接声明属性并从解构赋值中分配变量：

class Person {
    firstName: string;
    lastName: string;
    age: number;

    constructor({firstName, lastName, age} : {firstName: string, lastName: string, age: number}) {
        this.firstName = firstName;
        this.lastName = lastName;
        this.age = age;
    }
}

如果你这样做......你可能只是决定接受IPerson并分配它的成员，而不在构造函数中使用解构。

于 2015-10-19T17:54:00.310 回答
1

另一种策略是使用分配给不同名称的变量的能力。这减少了构造函数中的一次重复。

class Person {
    firstName: string;
    lastName: string;
    age: number;

    constructor(args: { firstName: string, lastName: string, age: number, }) {
        ({
            firstName: this.firstName,
            lastName: this.lastName,
            age: this.age,
        } = args);
    }
}

您还可以将构造函数中的定义之一移动到接口。

interface PersonConstructorArgs {
    firstName: string;
    lastName: string;
    age: number;
}
class Person {
    firstName: string;
    lastName: string;
    age: number;

    constructor(args: PersonConstructorArgs) {
        ({
            firstName: this.firstName,
            lastName: this.lastName,
            age: this.age,
        } = args);
    }
}

当您有层次结构时，这将很有用。

interface PersonConstructorArgs {
    firstName: string;
    lastName: string;
    age: number;
}
class Person {
    firstName: string;
    lastName: string;
    age: number;

    constructor(args: PersonConstructorArgs) {
        ({
            firstName: this.firstName,
            lastName: this.lastName,
            age: this.age,
        } = args);
    }
}
interface EmployeeConstructorArgs extends PersonConstructorArgs {
    manager: Person;
}
class Employee extends Person {
    manager: Person;

    constructor(args: EmployeeConstructorArgs) {
        super(args);
        ({
            manager: this.manager,
        } = args);
    }
}
于 2016-08-07T22:23:13.673 回答